Home:ALL Converter>When to use const with objects in JavaScript?

When to use const with objects in JavaScript?

Ask Time:2017-06-17T19:43:28         Author:Ala Eddine JEBALI

Json Formatter

I recently read about ES6 const keyword and I can understand its importance when having something like this:

(function(){
    const PI = 3.14;
    PI = 3.15; //  Uncaught TypeError: Assignment to constant variable
})();

So, nobody can change my PI variable.

The misunderstanding I have is that I don't understand in which situation the use of const with objects can make sense (other than preventing people to do myObj = newValue;).

(function(){
    const obj = {a:1 ,b: 2, c:3};
    //obj = {x:7 , y:8, z: 9}
    //This is good
    //TypeError: Assignment to constant variable.

    obj.a=7; obj.b=8 ; obj.c=9;
    console.log(obj); //outputs: {a: 7, b: 8, c: 9}
})();

So when declaring an object: when should I say: Now I must declare my object with const?

Author:Ala Eddine JEBALI,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/44604212/when-to-use-const-with-objects-in-javascript
burak :

According to ES6-Features.org, constants are used to make "variables which cannot be re-assigned new content".\nThe const keyword makes a variable itself immutable, not its assigned content. When the content is an object, this means the object itself can still be altered.\nTherefore, it's possible to change the content of the object that is declared with const variable, but you cannot assign a new object to a const variable.\nYou are still allowed to add new attributes to your object.\n\r\n\r\nconst myVar = \"someValue\";\nconst myObj = {\"name\": \"nameValue\", \"age\": 14}\n\nconsole.log(myVar); //someValue\nconsole.log(myObj.name); //nameValue\n\nmyObj.name = \"newNameValue\"; \nconsole.log(myObj.name); //newNameValue\n\nmyObj.someNewAttr = \"newAttrValue\";\nconsole.log(myObj.someNewAttr); //newAttrValue\n\nmyObj = {\"newNameAttr\": \"newNameValue\"}; //Uncaught TypeError: Assignment to constant variable.\nconsole.log(myObj.newNameAttr);\n\nmyVar = \"newValue\"; //Uncaught TypeError: Assignment to constant variable.\nconsole.log(myVar);",
2017-06-17T12:03:10
Daniel Vestøl :

let and const are meant for type safety. There is no situation where you must use them, but they can be handy and reduce hard to spot bugs.\n\nOne example of a situation where const would be useful for an object that you don't want to turn into another type.\n\nconst x = {\"hello\":\"world\"};\n\n// This is OK\nx.hello = \"stackoverflow\";\n\n// This is not OK\nx = JSON.stringify(x);\n",
2017-06-17T12:05:05
Karen Grigoryan :

If you work with an object and want to make sure that identity of the object is never changed say:\n\nconst a = {};\n\na.b = 1;\n\n// ... somewhere in the other part of the code or from an async call\n// suddenly\n\nsomeAjaxCall().then(() => { a = null; }) // for preventing this\n\n\nAlso using const is a good hint for javascript compiler to make optimisations about your code, thus making execution much faster then with let or var because the identity never changes, \n\nBUT \n\nbeware of using const/let in loops for performance reasons, because it might slowdown the performance due to creation of a variable per loop, but in most cases the difference is negligible.",
2017-06-17T12:02:05
Jaspreet Singh :

const actually creates immutable binding instead of making the variables immutable.\n\nSince primitive data-types (Boolean, null, undefined, String, and Number) are passed by value, they themselves become immutable and hence can't be re-assigned to some other value.\n\nIn the case of complex data-types (Array, Function, and Object), they are passed by reference. When we change or modify their properties/elements, we not changing their binding, hence const doesn't throw any error.",
2019-03-15T15:55:55
Shekhar Pankaj :

it is a common misconception around the web, CONST doesn't creates immutable variables instead it creates immutable binding.\n\neg.\n\n const temp1 = 1;\n temp1 = 2 //error thrown here.\n\n\nBut\n\n temp1.temp = 3 // no error here. Valid JS code as per ES6\n\n\nso const creates a binding to that particular object. const assures that variable temp1 won't have any other object's Binding.\n\nNow coming to Object. we can get immutable feature with Object by using Object.freeze\n\nconst temp3 = Object.freeze( {a:3,b:4})\ntemp3.a = 2 // it wont update the value of a, it still have 3\ntemp3.c = 6 // still valid but wont change the object\n",
2017-06-17T12:14:02
yy