Object Immutability
Object mutability means you can change, add, or remove properties from an object after it is created. This flexibility is one of JavaScript's core features, but in some cases, you may want to prevent changes to objects. For example, you might want to ensure that configuration objects or constants remain unchanged throughout your program. Immutability can help prevent bugs caused by accidental modifications and makes your code easier to reason about, especially in large or complex applications. JavaScript provides built-in methods to control object mutability: Object.freeze and Object.seal.
12345678910111213const config = { apiUrl: "https://api.example.com", timeout: 5000 }; Object.freeze(config); config.apiUrl = "https://malicious.com"; // This will not change the value config.newProp = "test"; // This will not add a new property delete config.timeout; // This will not remove the property console.log(JSON.stringify(config)); // Output: { apiUrl: "https://api.example.com", timeout: 5000 }
When you use Object.freeze, the object becomes completely immutable. You cannot add, delete, or modify any of its existing properties. Any attempt to change the object will fail silently in non-strict mode, or throw an error in strict mode. In the example above, trying to change the apiUrl, add a new property, or delete the timeout property has no effectβthe object stays exactly as it was when frozen.
However, Object.freeze only applies to the object's immediate properties. If a property is itself an object, it will not be frozen unless you explicitly freeze it as well.
The Object.seal method allows you to control object mutability in a more flexible way than Object.freeze. When you seal an object with Object.seal, you prevent new properties from being added and existing properties from being deleted. However, you can still modify the values of the properties that were present at the time the object was sealed. This means a sealed object remains extensible in terms of property values, but its structureβmeaning the set of its propertiesβcannot change.
Sealed objects are useful when you want to lock down the shape of an object but still allow updates to its data. For example, you might seal a user profile object to prevent accidental addition or removal of fields, while still allowing the user's information to be updated as needed.
12345678910111213const user = { name: "Alice", age: 30 }; Object.seal(user); user.name = "Bob"; // This will change the value user.email = "alice@example.com"; // This will not add a new property delete user.age; // This will not remove the property console.log(JSON.stringify(user)); // Output: { name: "Bob", age: 30 }
Thanks for your feedback!
Ask AI
Ask AI
Ask anything or try one of the suggested questions to begin our chat
What is the difference between Object.freeze and Object.seal?
Can you explain how to make nested objects immutable?
When should I use Object.freeze versus Object.seal?
Awesome!
Completion rate improved to 7.69Object Immutability
Swipe to show menu
Object mutability means you can change, add, or remove properties from an object after it is created. This flexibility is one of JavaScript's core features, but in some cases, you may want to prevent changes to objects. For example, you might want to ensure that configuration objects or constants remain unchanged throughout your program. Immutability can help prevent bugs caused by accidental modifications and makes your code easier to reason about, especially in large or complex applications. JavaScript provides built-in methods to control object mutability: Object.freeze and Object.seal.
12345678910111213const config = { apiUrl: "https://api.example.com", timeout: 5000 }; Object.freeze(config); config.apiUrl = "https://malicious.com"; // This will not change the value config.newProp = "test"; // This will not add a new property delete config.timeout; // This will not remove the property console.log(JSON.stringify(config)); // Output: { apiUrl: "https://api.example.com", timeout: 5000 }
When you use Object.freeze, the object becomes completely immutable. You cannot add, delete, or modify any of its existing properties. Any attempt to change the object will fail silently in non-strict mode, or throw an error in strict mode. In the example above, trying to change the apiUrl, add a new property, or delete the timeout property has no effectβthe object stays exactly as it was when frozen.
However, Object.freeze only applies to the object's immediate properties. If a property is itself an object, it will not be frozen unless you explicitly freeze it as well.
The Object.seal method allows you to control object mutability in a more flexible way than Object.freeze. When you seal an object with Object.seal, you prevent new properties from being added and existing properties from being deleted. However, you can still modify the values of the properties that were present at the time the object was sealed. This means a sealed object remains extensible in terms of property values, but its structureβmeaning the set of its propertiesβcannot change.
Sealed objects are useful when you want to lock down the shape of an object but still allow updates to its data. For example, you might seal a user profile object to prevent accidental addition or removal of fields, while still allowing the user's information to be updated as needed.
12345678910111213const user = { name: "Alice", age: 30 }; Object.seal(user); user.name = "Bob"; // This will change the value user.email = "alice@example.com"; // This will not add a new property delete user.age; // This will not remove the property console.log(JSON.stringify(user)); // Output: { name: "Bob", age: 30 }
Thanks for your feedback!
