![]() |
JavaScript is a dynamic language, in which objects can be freely modified after their creation. However, in some scenarios it may be useful or necessary to restrict changes to an object to protect data or maintain the integrity of a structure.
For this purpose, JavaScript provides two fundamental methods:
Object.seal()
Object.freeze()
In this article, we will see the difference between the two, how to use them correctly, and we will illustrate them with practical examples.
๐ Object.seal()
: lock the structure, but not the values
What is it?
Object.seal(obj)
seals an object: prevents the addition or removal of properties, but allows modification of existing property values.
When to use it?
When you want to protect the object structure, ensuring that no one can add or remove fields, but still allow changes to the data interior.
Example:
const user = {
name: "Alice",
age: 30
};
Object.seal(user);
user.age = 31; // ✅ allowed
user.city = "London"; // ❌ won't be added
delete user.name; // ❌ won't be deleted
console.log(user);
// Output: { name: 'Alice', age: 31 }
As you can see:
- The
age
property has been updated successfully. - Adding
city
is ignored. - Deleting
name
has no effect.
❄️ Object.freeze()
: Freeze structure and values
What is it?
Object.freeze(obj)
completely freezes an object: you can't add or remove properties, nor change their values.
When How to use it?
When you want to create an immutable object, for example, for configuration constants or data that must never change.
Example:
const config = {
host: "localhost",
port: 8080
};
Object.freeze(config);
config.port = 3000; // ❌ won't change
config.env = "production" // ❌ won't be added
delete config.host; // ❌ won't be deleted
console.log(config);
// Output: { host: 'localhost', port: 8080 }
๐งช How to check if an object is sealed or frozen?
JavaScript provides two methods to check the state of an object:
Object.isSealed(obj); // true if sealed
Object.isFrozen(obj); // true if frozen
Example:
const obj = {};
Object.seal(obj);
console.log(Object.isSsealed(obj)); // true
console.log(Object.isFrozen(obj)); // false
๐ Warning: seal
and freeze
are shallow
Both techniques only act on the top level of the object. If an object has nested properties (objects within objects), these remain editable unless they are also sealed or frozen recursively.
Example:
const settings = {
theme: {
color: "blue"
}
};
Object.freeze(settings);
settings.theme.color = "red"; // ✅ allowed (nested object not frozen)
console.log(settings.theme.color); // Output: "red"
How to freeze an object in depth?
You can use a recursive function:
function deepFreeze(obj) {
Object.getOwnPropertyNames(obj).forEach(prop => {
if (typeof obj[prop] === 'object' && obj[prop] !== null) {
deepFreeze(obj[prop]);
}
});
return Object.freeze(obj);
}
const deepSettings = {
theme: {
color: "blue"
}
};
deepFreeze(deepSettings);
deepSettings.theme.color = "red"; // ❌ won't change
console.log(deepSettings.theme.color); // Output: "blue"
✅ Conclusion
The seal
and freeze
techniques are powerful tools for controlling and protecting the state of JavaScript objects. Use them to:
- Prevent unintended changes
- Make objects immutable (with
freeze
) - Secure APIs or configurations
- Improve the security and stability of your code
Method | Add properties | Remove properties | Modify values |
---|---|---|---|
Object.seal |
❌ | ❌ | ✅ |
Object.freeze |
❌ | ❌ | ❌ |
Remember: for complex or deep objects, consider using recursive functions like deepFreeze()
for complete protection.
Follow me #techelopment
Official site: www.techelopment.it
facebook: Techelopment
instagram: @techelopment
X: techelopment
Bluesky: @techelopment
whatsapp: Techelopment
youtube: @techelopment