Menu

ECMAScript对象之定义多个属性和读取属性的特性

2018年2月18日 - php

我们在上一小节中详细介绍了ECMAScript对象的数据属性访问器属性,细心地同志肯定已经注意到,上一小节只是定义单个的数据属性和访问器属性,实际中给对象定义多个属性的可能性是很大的。

定义多个属性

ECMAScript定义了object.defineProperties()方法。利用这个方法可以通过描述符一次定义多个属性。这个方法接收两个对象参数:第一个对象是要添加和修改其属性的对象,第二个对象的属性与第一个对象中要添加或修改的属性一一对应。

var book={};
 Object.defineProperties(book,{
    _year:{
      writable:true,
      value:2004
   },
    edition:{
      writable:false,
      value:1
    },
    year:{
      get:function(){
         return this._year;
    },
    set:function(newValue){
      if(newValue>2004){
        this._year=newValue;
        this.edition+=newValue-2004;
       }
     }
   }
 });

console.log(book._year);//2004
 book._year=2005;
 console.log(book._year);//2005
 console.log(book.edition);//1
 book.edition=2;
 console.log(book.edition);//1
 console.log(book.year);//2005
 book.year=2010;
 console.log(book.edition);//1
 console.log(book._year);//2010
以上代码的结果都是博主运行得到,chrome浏览器。
以上代码在book对象上定义了两个数据属性(_year和edition)和一个访问其属性(year)。
其中给_year属性指定了writable特性为true,而给edition属性指定了writable特性为false,
即_year属性有写入能力而edition属性没有写入能力。
(我的理解,写入能力就是不能对这个属性的值进行修改,要么无效,要么报错。)
支持Object.defineProperties()方法的浏览器有IE9+、FireFox 4+、Safari5+、opera12+、chrome。

读取属性的特性

仅知道设置属性的特性是不够的,也需要获悉某个属性的特性,才能创建更好的应用。
使用ECMAScript 5的Object.getOwnPropertyDescriptor()方法,可以取得给定属性的特性信息。
这个方法接收两个参数:属性所在的对象和需要读取特性信息的属性名称。
该函数返回的是对象,如果是访问器属性,这个对象的属性有configurable、writable、set、get;
如果是数据属性,这个对象的属性有configurable、writable、enumerable、value;
 var book={};
 Object.defineProperties(book,{
   _year:{
   value:2004
 },
   edition:{
   value:1
 },
   year:{
     get:function(){
        return this._year;
     },
     set:function(newValue){
        if(newValue>2004){
           this._year=newValue;
           this.edition+=newValue-2004;
        }
      }
    }
 });

var descriptor=Object.getOwnPropertyDescriptor(book,”_year”);
console.log(descriptor.value);//2004
console.log(descriptor.configurable);//false
console.log(typeof descriptor.get);//”undefinded”

var descriptor=Object.getOwnPropertyDescriptor(book,”year”);
console.log(descriptor.value);//”undefined”
console.log(descriptor.enumerable);//false
console.log(typeof descriptor.get);//”function”

对于数据属性_year,value等于最初的值,之前提过,对于数据属性,如果不指定configurable的值,那么默认为false,数据属性是没有get和set特性;对于访问器属性year,value等于undefined,enumerable是false,而get则是一个指向getter函数的指针。在JavaScript中,可以针对任何对象–包括DOM和BOM对象,使用Object.defineOwnPropertyDescriptor()方法。

分享

One thought on “ECMAScript对象之定义多个属性和读取属性的特性

发表评论