1. 程式人生 > >javascript面向對象屬性函數用法(defineProperty與getOwnPropertyDescriptor)

javascript面向對象屬性函數用法(defineProperty與getOwnPropertyDescriptor)

ghost font 返回 java writable fig pan logs ict

defineProperty用於設置一個對象的屬性值和描述符,描述符有4個:[[Configurable]], [[Enumerable]], [[Writable]],[[Value]]

當一個屬性的描述符設置了[[Writable]],是什麽意思呢?

1         "use strict";
2         var person = {};
3         Object.defineProperty( person, "name", {
4             writable : false,
5             value : ‘ghostwu‘
6         } );
7 console.log( person.name ); //ghostwu 8 person.name = "this is ghostwu"; 9 console.log( person.name );//ghostwu
defineProperty為person對象,添加一個name屬性,兩個屬性描述符:
  • writeble屬性: false:不可寫 true: 可寫

  • value屬性: ‘ghostwu‘

也就是說,name這個屬性的值為ghostwu, 但是不能修改這個值。writable為false的時候,
如果對這個屬性name進行重新賦值(修改)在非嚴格模式下,賦值會被忽略,在嚴格模式下會報錯.


當一個屬性的描述符設置了[[Configurable]]?
 1 //        "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 );//ghostwu 10 11 Object.defineProperty( person, "name", { 12 configurable : true, //報錯 13 value : ‘ghostwu‘ 14 } );

defineProperty為person對象,添加一個name屬性,

  • configurable屬性: false:不可配置 true: 可配置
  • value屬性: ‘ghostwu‘

也就是說,name這個屬性的值為ghostwu, 但是不能刪除這個值,
configurable為false的時候,如果刪除name屬性,在非嚴格模式下,刪除操作會被忽略,在嚴格模式下會報錯

而且如果對一個設置了configurable為false的屬性,想把它重新改為true,會報錯, 如上例12行

當一個屬性的描述符設置了[[Enumerable]]?

 1 //        "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: 22
14         });
15 
16         /*
17             name--->ghostwu
18             age--->22
19         */
20         for( var i in person ){
21             console.log( i + ‘--->‘ + person[i] );
22         }

defineProperty為person對象,添加3個屬性,name,age,sex. enumerable屬性: false:不可枚舉 true: 可枚舉
也就是說一個屬性,如果他的enumerable的值為false,那麽這個屬性是不能被for...in遍歷(循環/枚舉)
如上例, sex設置為不可枚舉, 所以for..in不會把他枚舉出來

Object.getOwnPropertyDescriptor()方法:可以取得給定屬性的描述符, 這個方法支持2個參數, 參數1:屬性所在的對象. 參數2 : 屬性名稱。返回值為一個對象

1         var person = {
2             name : ‘ghostwu‘,
3             age : 22,
4         };
5         var descriptor = Object.getOwnPropertyDescriptor( person, "name" );
6         console.log( descriptor.configurable ); //true
7         console.log( descriptor.enumerable ); //true
8         console.log( descriptor.writable ); //true
9         console.log( descriptor.value ); //ghostwu

對於沒有使用Object.defineProperty定義的對象. 他們的描述符: configurable,enumerable,writable默認值都為true.

 1         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 ); //false
10         console.log( descriptor2.writable ); //false
11         console.log( descriptor2.value ); //ghostwu
對於使用Object.defineProperty定義的對象,如果沒有配置描述符的值,那麽configurable,enumerable,writable默認值為false

javascript面向對象屬性函數用法(defineProperty與getOwnPropertyDescriptor)