4、Object.defineProperty總結

 Object.defineProperty() segmentfault

參考:https://segmentfault.com/a/1190000007434923ide


定義:
方法會直接在一個對象上定義一個新屬性,或者修改一個已經存在的屬性, 並返回這個對象。
語法  
Object.defineProperty(obj,prop,descriptor)  
#### 參數
obj
須要定義屬性的對象。  
prop
需定義或修改的屬性的名字。  
descriptor
將被定義或修改的屬性的描述符。  
返回值  
==返回傳入函數的對象,即第一個參數obj==

```
value: 設置屬性的值
writable: 值是否能夠重寫。true | false
enumerable: 目標屬性是否能夠被枚舉。true | false
configurable: 目標屬性是否能夠被刪除或是否能夠再次修改特性 true | false
```

1、writable  default : false
當writable 爲false 時 屬性值不容許被修改函數

var  obj={};
Object.defineProperty(obj,"a",
{
    value:1
});
obj.a++;
console.dir(obj.a); // 1 

02var  obj={};
Object.defineProperty(obj,"a",
{
    value:"shangyy,
    writable:true
});
obj.a="huyating";
console.dir(obj.a);  //huyating
View Code


2、 enumerable  默認爲false 是否容許屬性被遍歷測試

var  obj={uname:"shangyy",age:18};
Object.defineProperty(obj,"a",
{
    value:1,
    writable:false,
    enumerable:false
});
console.dir(Object.keys(obj)); // 0: "uname" 1: "age"

var  obj={uname:"shangyy",age:18};
Object.defineProperty(obj,"a",
{
    value:1,
    writable:false,
    enumerable:false
});
console.dir(Object.keys(obj)); // 0: "uname" 1: "age" 2:"a"
View Code


3、configurable  
是否能夠刪除目標屬性或是否能夠再次修改屬性的特性(writable, configurable, enumerable)。設置爲true能夠被刪除或能夠從新設置特性;設置爲false,不能被能夠被刪除或不能夠從新設置特性。默認爲false。

這個屬性起到兩個做用:

目標屬性是否能夠使用delete刪除

目標屬性是否能夠再次設置特性
var obj = {}

#### 001 測試目標屬性是否能被刪除
```

//第一種狀況:configurable設置爲false,不能被刪除。
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:false
});
//刪除屬性
delete obj.newKey;
console.log( obj.newKey ); //hello

//第二種狀況:configurable設置爲true,能夠被刪除。
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:true
});
//刪除屬性
delete obj.newKey;
console.log( obj.newKey ); //undefined
```
002 測試是否能夠再次修改特性
```

//第一種狀況:configurable設置爲false,不能再次修改特性。
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:false
});

//從新修改特性
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.newKey ); //報錯:Uncaught TypeError: Cannot redefine property: newKey

//第二種狀況:configurable設置爲true,能夠再次修改特性。
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:true
});

//從新修改特性
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.newKey ); //hello
```

#### ****getter或setter
==注意:當使用了getter或setter方法,不容許使用writable和value這兩個屬性==  
注意:get或set不是必須成對出現,任寫其一就能夠。若是不設置方法,則get和set的默認值爲undefinedspa

var obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"newKey",{
    get:function (){
        //當獲取值的時候觸發的函數
        return initValue;    
    },
    set:function (value){
        //當設置值的時候觸發的函數,設置的新值經過參數value拿到
        initValue = value;
    }
});
//獲取值
console.log( obj.newKey );  //hello

//設置值
obj.newKey = 'change value';
console.log( obj.newKey ); //change value
View Code
相關文章
相關標籤/搜索