理解对象

一、什么是对象

创建自定义对象的最简单方式就是创建一个Object的实例,然后再为它添加属性和方法

var person = new Object();
person.name = 'Nicholas';
person.age = 29;
person.job = 'Software Engineer';

person.sayName = function(){
    alert(this.name);
}

早期的js开发人员经常使用这个模式创建新对象,几年后,对象字面量成为创建这种对象的首选模式

对象字面量:

var person = {
    name:'Nicholas',
    age:29,
    job:'Software Engineer',
    sayName:function(){
        alert(this.name);
    }
}    

这个例子中的person对象与前面的person对象是一样的,都有相同的属性和方法。

二、修改属性默认的特性

要修改属性的默认的特性,必须使用Object.defineProperty()。这个方法接收三个参数:属性所在的对象、属性的名字和一个描述符对象。
描述符对象:
configurable(表示能否通过delete删除属性),
enumerable(表示能否通过for-in循环返回属性),
writable(表示能否修改属性的值),
value(包含这个属性的数据值)

eg1:

var person={};
Object.defineProperty(person,'name',{
    writable:false,
    value:'Nicholas'
})
alert(person.name); //Nicholas
person.name='Greg';
alert(person.name); //Nicholas

创建了一个名为name的属性,它的值是只读的,这个属性的值是不可修改的


eg2:

var person={};
Object.defineProperty(person,'name',{
    configurable:false,
    value:'Nicholas'
})
alert(person.name); //Nicholas
delete person.name;
alert(person.name); //Nicholas

创建了一个名为name的属性,把configurable设置为false,表示不能从对象中删除属性


三、访问器属性的使用

访问器属性包含一对儿getter和setter函数,在读取访问器属性时,会调用getter函数,这个函数负责返回有效的值;在写入访问器时,会调用setter函数并传入新值,这个函数负责决定如何处理数据(在读取和写入都是自动调用getter和setter函数)

var book = {
    _year:2004,
    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;
alert(booke.edition); //2                

四、定义多个属性

es5中定义一个Object.defineProperties()方法定义多个属性,这个方法接收两个对象参数,第一个对象是要添加和修改其属性的对象,第二个对象的属性与第一个对象中腰添加或修改的属性一一对应

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

book.year = 2005;
alert(book._year); //2005
alert(book.edition); //2

 

五、取得给定属性的描述符

es5中定义了一个Object.getOwnPropertyDescriptor()方法,可以取得给定属性的描述符,这个方法接收两个参数:属性所在的对象和要读取其描述符的属性名称。

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');
alert(descriptor);// {value: 2004, writable: false, enumerable: false, configurable: false};
var descriptor1 = Object.getOwnPropertyDescriptor(book,'year');
alert(descriptor1);//{enumerable: false, configurable: false, get: ƒ, set: ƒ}
原文地址:https://www.cnblogs.com/wzndkj/p/7788056.html