The least used but very powerful javascript command
Here is a little known but very effective Javascript command that could simplify your code and make your software more efficient.
di Antonio Lamorgese
In this article we will explore the least used but very powerful javascript command. More precisely, the freeze method of the global Object. This special method allows you to make an object immutable, i.e. unchangeable. But before seeing in detail how freeze works, let’s understand what the global Object does.
Table of contents...
What does the global Object in Javascript do?
In JavaScript, the global Object is a constructor that is used to create objects. You can use the Object constructor to create a new object like this:
let myObject = new Object();
You can also create an object more concisely using the syntax expected by the language:
let myObject = {};The global Object has some built-in properties and methods that can be useful in JavaScript programming. For example, the Object object has a keys() method that returns an array of an object’s keys:
let myObject = { a : 1, b: 2, c: 3 };
let keys = Object.keys ( myObject );
console.log(keys); // output: ["a", "b", "c"]
assign ( ) method that can be used to copy the properties of one object to another object:
let obj1 = { a : 1 };
let obj2 = { b : 2 };
let obj3 = Object.assign ({}, obj1, obj2);
console.log(obj3); // output: { a : 1, b: 2 }In general, the global Object is mainly used as a constructor for creating objects in JavaScript and provides some useful methods for manipulating objects. As I have already anticipated, a little known but very effective method is the freeze method.Now let’s see in detail how this special method works.
What can you do with Object.freeze?
In JavaScript, objects are given by reference, which means that when you create an object variable, you are creating a pointer to an area of memory where the object is stored. If you change the object variable, you are changing the pointer, not the object itself.
Object.freeze allows you to freeze an object, preventing its modification. When an object is frozen, you cannot add, delete, or change the object’s properties. Using Object.freeze is especially useful in situations where you want to ensure that the object remains immutable, such as in data sharing applications.
Read also: How to Create a Website and Script in PHP Fast
How do you use Object.freeze ?
Object.freeze command takes an object as an argument and returns the object itself, which has been frozen. Let’s see an example:
const myObj = {
name: "John",
age: 30
};
Object.freeze ( myObj );In this example, we have created a myObj object with two properties, ” name ” and ” age “. We then called the Object.freeze command to freeze the object. After calling Object.freeze, you will not be able to add, delete, or change the properties of the myObj object.
myObj.name = "Mike"; console.log(myObj.name); // Output: "John"
As you can see from the example, when we tried to change the ” name ” property of the myObj object, the value didn’t change and the property remains the same as “John”.
Also, if you try to add a new property to the myObj object, you will get an error:
myObj.location = "New York"; console.log( myObj.location ); // Outputs: undefined
In this example, we tried to add a new “location” property to the myObj object, but the value of the property remains ” undefined “. This is because the object has been frozen and new properties cannot be added.
Limitations of Object.freeze
While Object.freeze is a useful method for making objects immutable, it has some limitations. In particular, with Object.freeze you can only freeze the properties of the top-level object, but not the properties of nested objects inside the parent object. To example:
const myObj = {
name: "John",
age: 30,
address: {
street: "123 Main St.",
city:"New York"
}
};
Object.freeze ( myObj );
myObj.address.city = "Los Angeles";
console.log( myObj.address.city ); //Output: "Los Angeles"myObj object has one property ” address “, which contains another object with two properties. But the properties of the child object are not affected by freeze at all.
freeze method at work, you can follow this short video tutorial where you can learn about another method, the Seal method which is also very useful if you develop with Javascript and you intend to create more robust and efficient software.
Conclusion
Javascript command we just explored may seem unfamiliar but it’s incredibly useful for improving the efficiency of our code. Using this command can reduce the amount of code we need to write and simplify our programs. So, next time you’re writing Javascript code, be sure to consider using this command to improve your productivity. Experiment and play with this command to find out how it can best be used in your next project.
