Home  >  Article  >  Web Front-end  >  JavaScript object-oriented attribute function usage

JavaScript object-oriented attribute function usage

大家讲道理
大家讲道理Original
2017-08-19 10:06:341466browse

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!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn