1. 程式人生 > >理解對象

理解對象

say 16px engine object 設置 war 負責 對象 name

一、什麽是對象

創建自定義對象的最簡單方式就是創建一個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: ƒ}

理解對象