javascript 访问器属性创建的三种方式

出自 javascript高级程序设计-第六章6.1节

javascript 访问器属性创建的三种方式:

以下year字段都是访问器属性,_yearedition是数据属性。

var book1 = { 
 _year: 2000, 
 edition: 1 
}; 
Object.defineProperty(book1, "year", { 
 get: function(){ 
     return this._year; 
 }, 
 set: function(newValue){ 
     if (newValue > 2000) { 
         this._year = newValue; 
         this.edition += newValue - 2000; 
     } 
 } 
}); 
book1.year = 3000; 
console.log(book1.year); // 3000
console.log(book1.edition); // 1001

var book2 = { 
 _year: 2000, 
 edition: 1 
}; 
//定义访问器的旧有方法
book2.__defineGetter__("year", function(){ 
 return this._year; 
}); 
book2.__defineSetter__("year", function(newValue){ 
 if (newValue > 2000) { 
 this._year = newValue; 
 this.edition += newValue - 2000; 
 } 
});
book2.year = 3000; 
console.log(book2.year); // 3000
console.log(book2.edition); // 1001

// 定义多个属性
var book3 = {};
Object.defineProperties(book3, {
     _year: { 
         value: 2000,
         writable:true // 书中没写这个,运行后会发现修改值book3.year=3000无效,writable不配置的话默认false,就不能改。故这里加上
     }, 
     
     edition: { 
         value: 1 ,
         writable:true
     }, 
     year: { 
         get: function(){
             return this._year; 
         }, 
         set: function(newValue){              
                 this._year = newValue; 
                 this.edition += newValue - 2000;              
         } 
     } 
});
book3.year = 3000; 
console.log(book3.year); // 3000
console.log(book3.edition); // 1001

book3 跟上面两book对象的唯一区别就是_yeareditionyear 这几个属性是同时创建的


获取属性的特性

book1,book2,book3都能这样获取,这里以book3为例:

// Object.getOwnPropertyDescriptor()方法,返回值是一个对象。
// 如果是访问器属性,这个对象的属性有 configurable、enumerable、get 和 set。
// 如果是数据属性,这个对象的属性有 configurable、enumerable、writable 和 value。
var descriptor = Object.getOwnPropertyDescriptor(book3, "_year"); 
console.log(descriptor.value); // 3000
console.log(descriptor.configurable); // false
console.log(descriptor.writable); // true
console.log(typeof descriptor.get); // "undefined"

var descriptor = Object.getOwnPropertyDescriptor(book3, "year"); 
console.log(descriptor.value); // undefined
console.log(descriptor.configurable); // false
console.log(typeof descriptor.get); // "function"

你可能感兴趣的:(JavaScript,专栏,javascript,访问器属性)