和所有的值類型一樣，對(duì)象有屬性。事實(shí)上，你可以將對(duì)象當(dāng)作一組屬性的集合，每個(gè)屬性都是一對(duì)（鍵和值）。鍵是字符串，值可以是任意JavaScript值。到目前為止，我們僅僅見過(guò)鍵是標(biāo)識(shí)符的屬性，因?yàn)辄c(diǎn)操作符處理的鍵必須為標(biāo)識(shí)符。在這節(jié)，你講見到另一種訪問(wèn)屬性的方法，能將任意字符串作為鍵。

單個(gè)對(duì)象（Single objects）

在JavaScript中，你可以直接創(chuàng)建對(duì)象，通過(guò)對(duì)象字面量：

var jane = {
    name: 'Jane',


    describe: function () {
        'use strict';
        return 'Person named '+this.name;
    }
};

上面的對(duì)象有兩個(gè)屬性：name 和 describe。你能讀（“get”）和 寫（“set”）屬性：

> jane.name  // get
'Jane'
> jane.name = 'John';  // set
> jane.newProperty = 'abc';  // 自動(dòng)創(chuàng)建

屬性是函數(shù)如 describe 可以被當(dāng)作方法調(diào)用。當(dāng)調(diào)用他們時(shí)可以在它們內(nèi)部通過(guò)this引用對(duì)象。

> jane.describe()  // 調(diào)用方法
'Person named John'
> jane.name = 'Jane';
> jane.describe()
'Person named Jane'

in 操作符用來(lái)檢測(cè)一個(gè)屬性是否存在：

> 'newProperty' in jane
true
> 'foo' in jane
false

若讀取一個(gè)不存在的屬性，將會(huì)得到undefined值。因此上面的兩個(gè)檢查也可以像下面這樣：

> jane.newProperty !== undefined
true
> jane.foo !== undefined
false

delete操作符用來(lái)刪除一個(gè)屬性：

> delete jane.newProperty
true
> 'newProperty' in jane
false

任意鍵屬性（Arbitrary property keys）

屬性的鍵可以是任意字符串。到目前為止，我們看到的對(duì)象字面量中的和點(diǎn)操作符后的屬性關(guān)鍵字。按這種方法你只能使用標(biāo)識(shí)符。如果你想用其他任意字符串作為鍵名，你必須在對(duì)象字面量里加上引號(hào)，并使用方括號(hào)獲取和設(shè)置屬性。

> var obj = { 'not an identifier': 123 };
> obj['not an identifier']
123
> obj['not an identifier'] = 456;

方括號(hào)允許你動(dòng)態(tài)計(jì)算屬性關(guān)鍵字：

> var x = 'name';
> jane[x]
'Jane'
> jane['na'+'me']
'Jane'

引用方法（Extracting methods）

如果你引用一個(gè)方法，它將失去和對(duì)象的連接。就其本身而言，函數(shù)不是方法，其中的this值為undefined（嚴(yán)格模式下）。

> var func = jane.describe;
> func()
TypeError: Cannot read property 'name' of undefined

解決辦法是使用函數(shù)內(nèi)置的bind()方法。它創(chuàng)建一個(gè)新函數(shù)，其this值固定為給定的值。

> var func2 = jane.describe.bind(jane);
> func2()
'Person named Jane'

方法內(nèi)部的函數(shù)（Functions inside a method）

每個(gè)函數(shù)都有一個(gè)特殊變量this。如果你在方法內(nèi)部嵌入函數(shù)是很不方便的，因?yàn)槟悴荒軓暮瘮?shù)中訪問(wèn)方法的this。下面是一個(gè)例子，我們調(diào)用forEach循環(huán)一個(gè)數(shù)組：

var jane = {
    name: 'Jane',
    friends: [ 'Tarzan', 'Cheeta' ],
    logHiToFriends: function () {
        'use strict';
        this.friends.forEach(function (friend) {
            // 這里的“this”是undefined
            console.log(this.name+' says hi to '+friend);
        });
    }
}

調(diào)用 logHiToFriends 會(huì)產(chǎn)生錯(cuò)誤：

> jane.logHiToFriends()
TypeError: Cannot read property 'name' of undefined

有兩種方法修復(fù)這問(wèn)題。

1：將this存儲(chǔ)在不同的變量。

logHiToFriends: function () {
    'use strict';
    var that = this;
    this.friends.forEach(function (friend) {
        console.log(that.name+' says hi to '+friend);
    });
}

2：forEach的第二個(gè)參數(shù)允許提供this值。

logHiToFriends: function () {
    'use strict';
    this.friends.forEach(function (friend) {
        console.log(this.name+' says hi to '+friend);
    }, this);
}

在JavaScript中函數(shù)表達(dá)式經(jīng)常被用作函數(shù)參數(shù)。時(shí)刻小心函數(shù)表達(dá)式中的this。

構(gòu)造函數(shù)：對(duì)象工廠（Constructors: factories for objects）

目前為止，你可能認(rèn)為JavaScript的對(duì)象僅是鍵值的映射，通過(guò)JavaScript對(duì)象字面量可以得出這個(gè)觀點(diǎn)，看起來(lái)很像其他語(yǔ)言中的地圖/字典（map/dictionary）。然而，JavaScript對(duì)象也支持真正意義上的面向?qū)ο筇匦裕豪^承（inheritance）。本節(jié)不會(huì)完全講解JavaScript中繼承的工作原理，但會(huì)給你以此為開始的簡(jiǎn)單模式。如果你想得到更多知識(shí)，請(qǐng)查閱這篇文章“JavaScript inheritance by example”。 除了作為“真正”的函數(shù)和方法，函數(shù)還在JavaScript中扮演第三種角色：如果通過(guò)new操作符調(diào)用，他們會(huì)變?yōu)闃?gòu)造函數(shù)，對(duì)象的工廠。構(gòu)造函數(shù)是對(duì)其他語(yǔ)言中的類的粗略模擬。約定俗成，構(gòu)造函數(shù)的第一個(gè)字母大寫。例如：

// 設(shè)置實(shí)例數(shù)據(jù)
function Point(x, y) {
    this.x = x;
    this.y = y;
}
// 方法
Point.prototype.dist = function () {
    return Math.sqrt(this.x*this.x + this.y*this.y);
};

我們看到構(gòu)造函數(shù)分為兩部分：首先，Point函數(shù)設(shè)置實(shí)例數(shù)據(jù)。其次，Point.prototype屬性包含對(duì)象的方法。前者的數(shù)據(jù)是每個(gè)實(shí)例私有的，后面的數(shù)據(jù)是所有實(shí)例共享的。 我們通過(guò)new操作符調(diào)用Point：

> var p = new Point(3, 5);
> p.x
3
> p.dist()
5.830951894845301

p是Point的一個(gè)實(shí)例：

> p instanceof Point
true
> typeof p
'object'

深入閱讀

• The pitfalls of using objects as maps in JavaScript?[important, read soon]
• JavaScript inheritance by example
• Object properties in JavaScript?[advanced: each property has attributes that determine whether it is writable, etc.]
• Private data for objects in JavaScript
• Javascript繼承 原型的陷阱
• Javascript 封裝問(wèn)題