Home > Article > Web Front-end > JavaScript object-oriented attribute function usage
defineProperty is used to set the property value and descriptor of an object. There are 4 descriptors: [[Configurable]], [[Enumerable]], [[Writable]], [[Value]]
What does it mean when the descriptor of a property is set to [[Writable]]?
1 "use strict";2 var person = {};3 Object.defineProperty( person, "name", {4 writable : false,5 value : 'ghostwu'6 } );7 console.log( person.name ); //ghostwu8 person.name = "this is ghostwu";9 console.log( person.name );//ghostwu
defineProperty为person对象,添加一个name属性,两个属性描述符:
writeble attribute: false: not writable true: writable
value attribute: 'ghostwu'
<span style="font-size: 16px">也就是说,name这个属性的值为ghostwu, 但是不能修改这个值。writable为false的时候,</span><br><span style="font-size: 16px">如果对这个属性name进行重新赋值(修改)在非严格模式下,赋值会被忽略,在严格模式下会报错.</span><br><br><span style="font-size: 16px"><strong>当一个属性的描述符设置了[[Configurable]]?</strong></span>
"use strict"; 2 var person = {}; 3 Object.defineProperty( person, "name", { 4 configurable : false, 5 value : 'ghostwu' 6 } ); 7 console.log( person.name ); //ghostwu 8 delete person.name; 9 console.log( person.name );//ghostwu10 11 Object.defineProperty( person, "name", {12 configurable : true, //报错13 value : 'ghostwu'14 } );
defineProperty is the person object , add a name attribute,
configurable attribute: false: not configurable true: configurable
value attribute: 'ghostwu'
In other words, the value of the name attribute is ghostwu, but this value cannot be deleted.
When configurable is false, if you delete the name attribute, in non-strict mode, the deletion operation will Ignored, an error will be reported in strict mode
And if you want to change a property that has configurable to false and want to change it to true, an error will be reported, as shown in line 12 of the above example
When an attribute descriptor is set to [[Enumerable]]?
"use strict"; 2 var person = {}; 3 Object.defineProperty(person, "name", { 4 enumerable: true, 5 value: 'ghostwu' 6 }); 7 Object.defineProperty(person, "sex", { 8 enumerable: false, 9 value: 'man'10 });11 Object.defineProperty(person, "age", {12 enumerable: true,13 value: 2214 });15 16 /*17 name--->ghostwu18 age--->2219 */20 for( var i in person ){21 console.log( i + '--->' + person[i] );22 }
defineProperty is the person object, adding 3 attributes, name, age, sex. enumerable attribute: false: Not available Enumeration true: enumerable
That is to say, for an attribute, if its enumerable value is false, then this attribute cannot be traversed by for...in (loop/enumeration)
As in the above example, sex Set to non-enumerable, so for..in will not enumerate it
Object.getOwnPropertyDescriptor() method: You can get the descriptor of a given property. This method supports 2 parameters, Parameter 1: The object where the attribute is located. Parameter 2: The attribute name. The return value is an object
var person = {2 name : 'ghostwu',3 age : 22,4 };5 var descriptor = Object.getOwnPropertyDescriptor( person, "name" );6 console.log( descriptor.configurable ); //true7 console.log( descriptor.enumerable ); //true8 console.log( descriptor.writable ); //true9 console.log( descriptor.value ); //ghostwu
For objects that are not defined using Object.defineProperty. Their descriptors: configurable, enumerable, writable default values are all is true.
var person2 = { 2 } 3 Object.defineProperty( person2, "name", { 4 value : 'ghostwu' 5 }); 6 7 var descriptor2 = Object.getOwnPropertyDescriptor( person2, "name" ); 8 console.log( descriptor2.configurable ); //false 9 console.log( descriptor2.enumerable ); //false10 console.log( descriptor2.writable ); //false11 console.log( descriptor2.value ); //ghostwu
<span style='font-family: "Microsoft YaHei"; font-size: 16px'>对于使用Object.defineProperty定义的对象,如果没有配置描述符的值,那么configurable,enumerable,writable默认值为false</span><br><br>
The above is the detailed content of JavaScript object-oriented attribute function usage. For more information, please follow other related articles on the PHP Chinese website!