面向对象的程序设计

本文来源于自我读书心得,书籍为《javascript高级程序设计》,译者李松峰,曹力。

网上可以参照MSDN的文章:http://msdn.microsoft.com/zh-cn/library/ie/hh965578(v=vs.94).aspx

javascript对象属性类型分为:数据属性访问器属性,内部属性

一.数据属性

该属性列表包括以下属性(默认为true的情形是当对象为对象字面量的创建方式时):

  1. configurable:是否可以delete属性,或者把属性改为访问器属性,默认true
  2. enumberable:for-in是否可以枚举属性,默认true
  3. writable:能否修改属性,默认true
  4. value:属性值,默认undefined

二.访问器属性

首先得明确一点,访问器属性不包含数据值。这个相当重要啊,别忽略了。

  1. configurable:默认true
  2. enumberable:默认true,
  3. get:默认undefined
  4. set:默认undefined

三.方法

  • Object.defineProperty(obj,objAttribute,configureObj):传入三个参数,分别为实例对象,该对象的属性,该对象该属性的配置
  • Object.defineProperties(obj,configureList)
  • Object.getOwnPropertyDescriptor()

四.代码示例及说明

1.单独设置对象的数据属性:

/*
*面向对象的js
*js对象中的高级属性设置
*/
"use strict";
var book={
    year:2004,
    edition:1
};
// 设置单个属性
Object.defineProperty(book,'year',{
    configurable:false,
    writable:false
});
// book.year=2;
delete book.year;
var person={};
Object.defineProperty(person,'name',{
    writeable:false,
    value:'xiaoming'
});

2.设置多个数据属性,使用Object.defineProperties()

var person={};
Object.defineProperties(person,{
    name:{
        writable:false,
        value:'xiaoming'
    },
    age:{
        value:23
    },
    say:{
        value:function(){
            // console.log();
            alert('name is:'+this.name+',age is:'+this.age);
        }
    }
});

3.读取属性特性Object.getOwnPropertyDescriptor()

var des = Object.getOwnPropertyDescriptor(person,'age');
console.log(des.value+','+des.writable+','+des.get);

4.访问器属性

"use strict";
var book={
    _year:2000,
    edition:1
};
// 设置单个属性
Object.defineProperty(book,'year',{
    get:function(){
        return this._year;
    },
    set:function(newValue){
        if(newValue>2004){
            this._year=newValue;
            this.edition+=newValue-2004;
        }
    }
});
book.year=2005;
console.log(book.year);

 访问器属性不包含数据值,所以,你会看到设置的year属性,影响的都是_year.如果你针对year属性设置year属性,就递归调用死循环了,浏览器会报栈溢出。如下:

var book={
    year:2000,
    edition:1
};
// 设置单个属性
Object.defineProperty(book,'year',{
    get:function(){
        return this.year;
    },
    set:function(newValue){
        if(newValue>2004){
            this.year=newValue;
            this.edition+=newValue-2004;
        }
    }
});
book.year=2005;
console.log(book.year);

五.疑惑

  1. enumberable属性设置为false,也是可以枚举属性的,浏览器也不抛出异常
  2. MSDN参考文档中给出的:writable,configurable,enumberable,属性默认为false。但是实践不是啊,默认为true。《javascript高级程序设计》则翻译为:直接在对象上定义的属性,它们的特性值为true

 

原文地址:https://www.cnblogs.com/my_front_research/p/3115369.html