Detailed explanation of property attributes of JavaScript objects

Detailed explanation of property attributes of JavaScript objects_Basic knowledge

WBOY

Release： 2016-05-16 16:53:56

Original

1204 people have browsed it

The property of an object in JavaScript has three attributes:
1.writable. Whether the property is writable.
2.enumerable. Whether the property will be enumerated when using the for/in statement.
3. configurable. Whether the properties of this property can be modified and whether the property can be deleted.

In the ECMAScript 3 standard, the values of the above three properties are true and cannot be changed: the property of the newly created object is writable, enumerable, and deletable; in the ECMAScript 5 standard, it can be passed Property description object (property descriptor) to configure and modify these properties.

If the value information of the property is also viewed as the attribute of the property, the property in the object has four attributes: value, writable, enumerable and configurable.

For a property defined with getter and setter methods, since it does not have a writable attribute (whether the property is writable depends on whether the setter method exists), this property also has four attributes: get, set, enumerable and configurable — get and the value of the set attribute is function.

Get the properties of the object property

In the ECMAScript 5 standard, you can obtain the property information of a property of the object itself through Object.getOwnPropertyDescriptor():

Copy code The code is as follows:

var o = {x:1};
var a = Object.create(o);
a.y = 3;
console.log( Object.getOwnPropertyDescriptor(a, "y"));//Object {configurable=true, enumerable=true, writable=true, value=3}
console.log(Object.getOwnPropertyDescriptor(a, "x")) ;//undefined

As you can see, if the property does not exist or the property inherits from the prototype object, undefined is returned.

Set the properties of the object property

In the ECMAScript 5 standard, you can set the property of a property of the object itself through Object.defineProperty():

Copy code The code is as follows:

Object.defineProperty(a, "y", {
 value:3,
 writable:true,
 enumerable:false,
 configuration: true
});
console.log(a.propertyIsEnumerable("y"));//false

If the set property is inherited from the prototype object, then JavaScript will Create a property with the same name in the object itself, which is consistent with the related behavior of the assignment operation:

Copy code The code is as follows:

Object.defineProperty(a, "x", {
 value:1,
 writable:true,
 enumerable:false,
 configuration:true
}) ;
console.log(a.propertyIsEnumerable("x"));//false
console.log(o.propertyIsEnumerable("x"));//true

In addition to modifying property Attributes, you can also change the property to be accessed by getter or setter:

Copy the code The code is as follows:

 
Object.defineProperty(a, "y", {
 get:function(){return 42;}
});
console.log(a.y);//42

When using Object.defineProperty(), the property value in the property description object can be partially ignored. When the property value is ignored, the processing rules in JavaScript are as follows:

If the property is newly created, all ignored property values are false or undefined.
If the property already exists, all ignored property values remain unchanged.

Set the properties of object properties in batches

If you need to set the properties of multiple properties at once, you can use the Object.defineProperties() statement. This statement will return the modified object.

Copy code The code is as follows:

Object.defineProperties(a, {
 "y ":{value:79, writable:true, enumerable:true, configurable:true},
 "z":{value:99, writable:true, enumerable:true, configurable:true}
}); 
console.log(a);//Object {y=79, z=99}

Property attribute setting rules

When modifying property attributes, the following rules must be followed. If the rules are violated, JavaScript will report a TypeError:

If the object is not extensible, you can only modify the properties of existing properties and cannot add new properties.
If the configurable attribute of the property is false, the values of the configurable and enumerable attributes cannot be modified. For the writable attribute, you can change it from true to false, but you cannot change it from false to true. If a property is defined by getters and setters, the getter and setter methods cannot be modified.
If the configurable attribute and writable attribute of the property are both false, the property value cannot be changed. If the property's writable attribute is false but its configurable attribute is true, the property value can still be modified.