Js中的Object.defineProperty

標籤：列印   des   on()   tab   console   目標   模式   log   注意   

通過Object.defineProperty為對象設定屬性，並同時規定屬性的屬性（可見度，可配置性，可枚舉性等）

備忘：如果通過var obj = {} obj.age = 18這種方式設定的屬性，他的可見度，可配置性，可枚舉性等都為true，相當於預設設定了本篇討論的各種屬性都為true

 

文法：Object.defineProperty(obj, prop, descriptor)

第一個參數:目標對象
第二個參數:需要定義的屬性或方法的名字。
第三個參數:目標屬性所擁有的特性。（descriptor）

descriptor:取值
　　value:屬性的值
　　writable:如果為false，屬性的值就不能被重寫,只能為唯讀了
　　configurable:總開關，一旦為false，就不能再設定他的（value，writable，configurable）
　　enumerable:是否能在for...in迴圈中遍曆出來或在Object.keys中列舉出來。
　　get:設定方法
　　set:擷取方法

 

descriptor預設值
　　var a= {}
　　Object.defineProperty(a,"b",{
　　　　value:123
　　})
　　console.log(a.b);//123
只設定了value別的並沒有設定，它會預設把writable，configurable，enumerable都設定為false

 

configurable  總開關，第一次設定 false 之後，第二次什麼設定也不行了

備忘：如果是不可配置，可以把writable由true改為false但不能從false改為true
　　var a= {}
　　Object.defineProperty(a,"b",{
　　　　configurable:false
　　})
　　Object.defineProperty(a,"b",{
　　　　configurable:true
　　})
　　//error: Uncaught TypeError: Cannot redefine property: b

 

writable  如果設定為fasle，就變成唯讀了。。
　　var a = {};
　　Object.defineProperty(a, "b", {
　　　　value : 123,
　　　　writable : false
　　});
　　console.log(a.b);  // 列印 37
　　a.b = 25;　　　　 // 沒有錯誤拋出（在strict 模式下會拋出）
　　console.log(a.b);  // 列印 37， 賦值不起作用。

 

 

enumerable  定義了對象的屬性是否可以在 for...in 迴圈和 Object.keys() 中被枚舉。
　　var a= {}
　　Object.defineProperty(a,"b",{
　　　　value:3445,
　　　　enumerable:true
　　})
　　console.log(Object.keys(a));　　// 列印["b"]
　　改為false
　　var a= {}
　　Object.defineProperty(a,"b",{
　　　　value:3445,
　　　　enumerable:false
　　})
　　console.log(Object.keys(a));// 列印[]

set和get  賦值 或者 取值的時候會分別觸發 set 和 get 對應的函數
註：1.不能同時設定get和set與wriable或value，就是說想用get和set，就不能用wriable或value中的任何一個

　　2.通過obj={} 這種形式去定義get/set方法的時候，和這裡不太一樣

　　　　a.get/set和函數之間不需要冒號,例如obj={get name(){return "xiaol"}}
　　var a= {}
　　Object.defineProperty(a,"b",{
　　　　set:function(newValue){
　　　　　　console.log("你要賦值給我,我的新值是"＋newValue)
　　　　},
　　　　get:function(){
　　　　　　console.log("你取我的值")
　　　　　　return 2 　　//注意這裡，我寫入程式碼返回2
　　　　}
　　})
　　a.b =1 　　//列印 你要賦值給我,我的新值是1
　　console.log(a.b) //列印 你取我的值
　　　　　　　　　　 //列印 2 注意這裡，和我的寫入程式碼相同的

Js中的Object.defineProperty