The function Object.defineProperties() allows for reassigning a property's value after it has been initially

The issue arises in the initial code snippet provided below, specifically when dealing with the object book. Initially, the value of book.year is set to 2013. Even after updating the value by setting book.year = 2015, retrieving the value using book.year still returns 2013 instead of 2015. The question remains - where am I making a mistake?

Below is the code snippet in question:

var book = {};
Object.defineProperties(book, {
    _yearOrigin: {
        value: 2013
    },
    edition: {
        value: "1st"
    },
    year: {
        get: function(){return this._yearOrigin},
    
        set: function(newValue){
            //assigning this._yearOrigin
            this._yearOrigin = newValue; 
    
            //operations for evaluating the 'subscript' to add in this.edition
            var diff = String(newValue - 2013); 
            var diffLast2ndChar = diff.charAt(diff.length - 2);
            var diffLastChar = diff.charAt(diff.length - 1);
            var subscript = "";
    
            if (diff.length > 1 && diffLast2ndChar == "1") {
                subscript = "th"; 
            } else {
                subscript = diffLastChar == "1"
                                ? "st"
                                : diffLastChar == "2"
                                    ? "nd"
                                    : diffLastChar == "3"
                                        ? "rd"
                                        : "th" ;
            }
            
            //assignment operation for this.edition
            var rawEdition = Number(this.edition.charAt(0)) + Number(diff);
            this.edition = String(rawEdition) + subscript;
        }
    }
});

>>> book.year = 2015
>>>book.year //the output comes as 2013, but it should be 2015

In contrast, another similar code excerpt presented below showcases an expected behavior. When attempting to retrieve the value of book2.year, and subsequently setting it as 2013, the output correctly reflects 2013.

var book2 = {
    _year: 2004,
    edition: 1
};
Object.defineProperty(book2, "year", {
    get: function(){
        return this._year;
    },
    set: function(newValue){
        if (newValue > 2004) {
            this._year = newValue;
            this.edition += newValue - 2004;
        }
    }
});

book2.year = 2005;
console.log(book2.year); //2005 (In this instance, the output is as expected)

Answer №1

It slipped my mind that when using

Object.Property/Object.properties
to define a property of an object, the default value for writable is false, meaning the defined value cannot be changed (non-writable). This was pointed out by some individuals in the comments.

After including writable = true as shown below, the issue was resolved and the expected outcome appeared:

_yearOrigin: {
    value: 2013,
    writable: true
},

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to incorporate async/await in a useEffect hook in a React Native application?

Upon executing useEffect, my objective is to retrieve the token from AsyncStorage, fetch the data value using the axios.post('/auth/me') endpoint, and trigger the KAKAOLOG_IN_REQUEST action through dispatch. After verifying that the data value i ...

Is it possible to show or hide a DIV based on the text content of another DIV using JavaScript in

I am looking for a way to dynamically hide a DIV based on user roles using only the text inside a title tag as a reference. Here is an example of the HTML structure: <title>admin</title> If the user role is admin, then hide the following DI ...

Difficulty in jQuery's clone() function: cloning an input element without its value

I have successfully implemented jquery's .clone() method, but I'm facing an issue where the value of the previous input field is also getting cloned along with it. How can I prevent this from happening? Below is my code snippet: function addrow ...

Disconnected WebSocket in Node.js using Socket.io

Currently, I am encountering an issue. It involves a login page that leads to another page where my socket connection is disrupted. The goal I am striving for is: Within my server-side app.js app.post('/login', urlencodedParser, function(req, ...

AngularJS allows for the creation of cascading dropdown selects, where the options in the second select

I'm struggling to access the version data stored in the server model, but it's not cooperating. My suspicion is that when the page loads, the initial data from the first select isn't available yet because it hasn't technically been sel ...

Activate the "order evaluation" trigger on the checkout page in Woocommerce

I have implemented the Woocommerce Advanced Shipping plugin created by Jeroen Sormani for managing shipping methods, along with the WooCommerce Pay for Payment plugin developed by Karolína Vyskočilová to add a fixed €5 fee to the "cash on delivery" pa ...

How can I maintain the selected state of checkbox and radio button in ReactJS after page refresh?

I am facing an issue with my multistep form that contains radio buttons and checkboxes from material UI. Although the data is stored correctly in state and local storage, when I move to the next page and then return, the selections appear unselected to the ...

Leverage JavaScript to update the name of a Google Spreadsheet using the latest data

Here is some code that allows you to rename a document: function renameFile() { var s = SpreadsheetApp.getActiveSpreadsheet(); s.rename("new file name"); } Can you modify this function to rename the file to "new filename 1/18"? Remember, where 18 r ...

How to trigger a JavaScript function using a button click

I've been struggling to figure out why my JavaScript code isn't functioning properly within Ionic. Can anyone guide me on how to store a number in a variable, display that variable, and increment it when a button is clicked? I have successfully ...

JavaScript is unable to make changes to the page once it has finished loading

I have implemented a JavaScript code that allows me to send messages in a chat interface: function sendMessageToChat(conversation, message) { $("#content").html(conversation + message); $(".current-msg").hide(); $(".current-msg").delay(500).fadeIn ...

Can you explain the process of utilizing Angular databinding to display nested information?

I'm facing a challenge with databinding when working with nested arrays in multiple timeslots and windows. Despite understanding the basics, I can't seem to make it work no matter how I try different approaches. It's really frustrating not k ...

Unable to alter the height of the element

I am attempting to resize an element by dragging, similar to this example. I have created a simple directive for this purpose: @Directive({ selector: '[drag-resize]' }) export class DragResizeDirective { private dragging: boolean; const ...

Adding a new value to an array of objects without altering the existing values in ReactJS and NextJS

I have a JSON file containing image names that I need to organize into a Key-Value Object. I am currently using regex to create keys by removing "-img[image No]". However, I am having trouble storing all the image names in the array without overwriting pre ...

When adding an object to an array in AngularJS, it seems to trigger updates for

Currently, I am fetching data from a WebAPI and then storing it in an array called products, which is scoped. $scope.products In addition to the products array, I also have another scoped array named selectedFish. $scope.selectedFish = []; My objective ...

Ensuring that md-select(s) created through ng-repeat are linked to the same model

<div ng-repeat="(key, value) in dataSet | groupBy: 'partner.partnerName'"> <md-select ng-model="userName" placeholder="{{ key }}" class="partnerUser" > <md-option >{{ key }} </md-option> <md-option ng-repe ...

Monitor the x and y positions for platformer game interactions using only JavaScript and jQuery

I am currently working on a 2D platformer game as part of my college project alongside my friends. We are using jQuery and pure JS for development. So far, we have been able to move the character left and right using jQuery's animate function, and ena ...

Sharing Variables with $(document).ready

I need help understanding why this code is not functioning and how I can fix it. Despite my efforts to use namespaces and IIFEs, I am still unable to make it work. $(document).ready(function() { alert (hi); }); $(document).ready(function() { var hi = ...

Unable to modify the color of UML state elements within JointJS

I need some help with jointjs as I am in the process of adjusting the color of a UML state diagram graph using this command: graph.getElements()[4].attributes.attrs[".uml-state-body"]["fill"] = "#ff0000"; However, despite trying this, the color of the st ...

Combine two pieces of data from a JSON object using Angular's ng-repeat

Trying to organize data from a separate array into one section of a table. The first JSON named "names" : [ { "name": "AAAAAA", "down": "False" }, { "name": "BBBBBB", "down": "Tru ...

The retrieved item has not been linked to the React state

After successfully fetching data on an object, I am attempting to assign it to the state variable movie. However, when I log it to the console, it shows as undefined. import React, {useState, useEffect} from "react"; import Topbar from '../H ...