revision:
The Object.freeze() static method freezes an object. Freezing an object prevents extensions and makes existing properties non-writable and non-configurable.
A frozen object can no longer be changed: new properties cannot be added, existing properties cannot be removed, their enumerability, configurability, writability, or value cannot be changed, and the object's prototype cannot be re-assigned. freeze() returns the same object that was passed in. Freezing an object is the highest integrity level that JavaScript provides.
Object.freeze(obj)
Parameters:
obj : required. The object to freeze.
const obj = {
prop: 42
};
Object.freeze(obj);
obj.prop = 33;
// Throws an error in strict mode
console.log(obj.prop);
// Expected output: 42
Object.freeze(new Uint8Array(0)); // No elements
// Uint8Array []
Object.freeze(new Uint8Array(1)); // Has elements
// TypeError: Cannot freeze array buffer views with elements
Object.freeze(new DataView(new ArrayBuffer(32))); // No elements
// DataView {}
Object.freeze(new Float64Array(new ArrayBuffer(64), 63, 0)); // No elements
// Float64Array []
Object.freeze(new Float64Array(new ArrayBuffer(64), 32, 2)); // Has elements
// TypeError: Cannot freeze array buffer views with elements
example: freezing objects
<div>
<p id="freeze-1"></p>
<p id="freeze-2"></p>
<p id="freeze-3"></p>
<p id="freeze-4"></p>
</div>
<script>
const obj = {
prop() {},
foo: "bar",
};
// Before freezing: new properties may be added, and existing properties may be changed or removed
obj.foo = "baz";
obj.lumpy = "woof";
delete obj.prop;
// Freeze.
const o = Object.freeze(obj);
// The return value is just the same object we passed in.
o === obj; // true
console.log(o);
document.getElementById("freeze-1").innerHTML = "freeze object : " + JSON.stringify(o);
// The object has become frozen.
Object.isFrozen(obj); // === true
document.getElementById("freeze-2").innerHTML = "object is frozen : " + Object.isFrozen(o);
// Now any changes will fail
obj.foo = "quux"; // silently does nothing
// silently doesn't add the property
obj.quaxxor = "the friendly duck";
// In strict mode such attempts will throw TypeErrors
function fail() {
"use strict";
obj.foo = "sparky"; // throws a TypeError
delete obj.foo; // throws a TypeError
delete obj.quaxxor; // returns true since attribute 'quaxxor' was never added
obj.sparky = "arf"; // throws a TypeError
}
fail();
// Attempted changes through Object.defineProperty; both statements below throw a TypeError.
Object.defineProperty(obj, "ohai", { value: 17 });
Object.defineProperty(obj, "foo", { value: "eit" });
// It's also impossible to change the prototype; both statements below will throw a TypeError.
Object.setPrototypeOf(obj, { x: 20 });
obj.__proto__ = { x: 20 };
</script>
example: freeze an object, i.e. prevent the object from being modified.
<div>
<p id="freeze-3"></p>
<p id="freeze-4"></p>
<p id="freeze-5"></p>
<p id="freeze-6"></p>
</div>
<script>
let obj1 = {
prop: function () {},
foo: "bar",
};
// freeze the object
Object.freeze(obj1)
console.log(obj1.foo)
document.getElementById("freeze-3").innerHTML = "freeze object : " + Object.freeze(obj1);
document.getElementById("freeze-4").innerHTML = "freeze object : " + JSON.stringify(Object.freeze(obj1));
// changes will not occur
obj1.foo = "bar1";
console.log(obj1.foo);
// Output: bar
document.getElementById("freeze-5").innerHTML = "freeze object : " + Object.freeze(obj1);
document.getElementById("freeze-6").innerHTML = "freeze object : " + JSON.stringify(Object.freeze(obj1));
</script>