This is the 9th day of my participation in the November Gwen Challenge. Check out the event details: The last Gwen Challenge 2021

Object. Freeze and Object. Seal are two common methods used with Object

concept

Let’s look at both definitions

Freeze definition in MDN

The object.freeze () method freezes an Object. A frozen object can no longer be modified. If you freeze an object, you cannot add new attributes to the object, delete existing attributes, modify the enumerability, configurability, writability of existing attributes of the object, or modify the value of existing attributes. In addition, the stereotype of an object cannot be modified after it is frozen. Freeze () returns the same object as the argument passed in.

The definition of object. seal in MDN

The object.seal () method seals an Object, preventing the addition of new properties and marking all existing properties as unconfigurable. The value of the current property can be changed as long as it was previously writable.

Object. Freeze Is the core of an Object that cannot be modified. The core of Object.seal is closed, specifically non-configurable, and does not affect the modification of old property values

differences

Define an object around which the next comparison takes place

"use strict";
const obj = {
    name: "nordon"
};
Copy the code

useObject.freeze

Object.freeze(obj);
Object.isFrozen(obj); // true
obj.name = "wy";
Copy the code

Use object. isFrozen to check whether data isFrozen by object. freeze and return Boolean data

Uncaught TypeError: Cannot assign to read only property ‘name’ of object ‘#< object >’ TypeError: Cannot assign to read only property ‘name’ of object ‘#< object >’

useObject.seal

Object.seal(obj);
Object.isSealed(obj); // true
obj.name = "wy";
Copy the code

Object. IsSealed detects whether the data isSealed by Object. Seal and returns a Boolean value

In this case, the name is successfully modified, and the OBJ is also successfully modified

Note: If strict mode is not enabled, the browser goes into silent mode and does not throw exception messages on the console

In common

This is mainly demonstrated with Object.seal

Do not delete

delete obj.name;
Copy the code

TypeError: Cannot delete property ‘name’ of #Uncaught TypeError: Cannot delete property ‘name’ of #

configurable

You can modify the original attribute values

Object.defineProperty(obj, 'name', {
  value: 'wy'
})
Copy the code

New attribute values cannot be added

Object.defineProperty(obj, "age", {
    value: 12});Copy the code

Uncaught TypeError: Cannot define Property age, Object is not Extensible

Deeply nested

Both are powerless against deeply nested data

Define a nested object

"use strict";
const obj = {
  name: "nordon".info: {
    foo: 'bar'}};Copy the code

For obJ, data inside the info operation cannot be processed in either freeze or SEAL

obj.info.msg = 'msg'
Copy the code

The data source OBJ has been modified to not be affected by freezing or freezing

If you want to do nested data processing, you need to recursively facilitate data source processing. This operation needs to be noted: when the data contains a circular reference, it will trigger an infinite loop

preventExtensions

Finally, object-preventExtensions, why isn’t this method contrasted with Object.freeze and object.seal? Because it is basically the same as SEAL, the only difference is that the DELETE attribute is available, so I’ll leave it at the end

Look at a piece of code

"use strict";
const obj = {
    name: "nordon"};Object.preventExtensions(obj);
Object.isExtensible(obj); // false, which means it is not extensible

delete obj.name;
Copy the code