During JavaScript web application development, we may get a requirement to update a const object. This article will share how to update a const object in JavaScript.
How to update a const object in JavaScript
ES6 introduced the const keyword to define a new variable. The difference in declaring a const variable from others is that it cannot be reassigned, but if we declare an object as const, we can update the properties that the object contains. The critical point here is that objects are const, not their properties.
Update a const object
We can add, edit and delete object properties.
Example:
// Declare the 'user' object
const user = {
firstName: "LearnShare",
lastName: "IT",
aboutIt: "Let's learn and share knowledge about IT"
};
console.log('Object has not been updated:');
console.log(user);
// Add the 'age' property
user.age = 18;
// Edit 'firstName' and 'lastName' properties
user.firstName = "IT";
user.lastName = "LearnShare";
// Delete 'aboutIt' property
delete user.aboutIt;
console.log('Object has been updated:');
console.log(user);Output:
Object has not been updated:
{
firstName: 'LearnShare',
lastName: 'IT',
aboutIt: "Let's learn and share knowledge about IT"
}
Object has been updated:
{
firstName: 'IT',
lastName: 'LearnShare',
age: 18
}In this example, the “user” object has properties firstName, lastName, and aboutIt. We added the ‘age’ property, fixed the ‘firstName’ and ‘lastName’ properties, and deleted the ‘aboutIt’ property. However, reassigning the object generates an error.
Example:
// Declare the 'user' object
const user = {
firstName: "LearnShare",
lastName: "IT",
aboutIt: "Let's learn and share knowledge about IT"
};
console.log('Object has not been updated:');
console.log(user);
// Reassign the 'user' object
const user = {
firstName: "IT",
lastName: "LearnShare",
age = 18,
};
console.log('Object has been updated:');
console.log(user);Output:
SyntaxError: Identifier 'user' has already been declaredFreeze a const object
If you want to freeze an object and cannot modify it, you can use the Object.freeze() method.
The Object.freeze() method is used to freeze an object. Freezing an object will not allow operations to add, edit, or delete existing properties of the object.
Syntax:
Object.freeze (obj)
Parameter:
- obj: object is frozen
Return value:
The object passed to the method.
Example:
// Declare the 'user' object
const user = {
firstName: "LearnShare",
lastName: "IT",
age: 18,
aboutIt: "Let's learn and share knowledge about IT"
};
console.log('Object has not been updated:');
console.log(user);
// Delete 'age' property
delete user.age;
// Freeze the "user" object
const user1 = Object.freeze(user);
// Edit 'firstName' and 'lastName' properties
user.firstName = "IT";
user.lastName = "LearnShare";
console.log('Object has been updated:');
console.log(user);Output:
Object has not been updated:
{
firstName: 'LearnShare',
lastName: 'IT',
age: 18,
aboutIt: "Let's learn and share knowledge about IT"
}
Object has been updated:
{
firstName: 'LearnShare',
lastName: 'IT',
aboutIt: "Let's learn and share knowledge about IT"
}In this example, we assigned the “user” object the “age: 18” property, which was later deleted because the Object “user” did not freeze by the object.freeze() method. Then, we assigned freeze values of “user” to “user1”, which prevented the “user” object from updating further.
Summary
This article has shown how to update a const object in JavaScript. I hope the information in this article will be helpful to you. If you have any problems, please comment below. I will answer. Thank you for reading!
Maybe you are interested:
- Check if an object is empty in JavaScript
- Check if a key exists in a javaScript object
- Check if an Object Property is Undefined in JavaScript
Hello, my name’s Bruce Warren. You can call me Bruce. I’m interested in programming languages, so I am here to share my knowledge of programming languages with you, especially knowledge of C, C++, Java, JS, PHP.
Name of the university: KMA
Major: ATTT
Programming Languages: C, C++, Java, JS, PHP
