本文寫作時(shí)長5小時(shí)

OO語言都有一個(gè)特點(diǎn)，就是都存在類的概念割粮。通過類自定義類型，創(chuàng)建對(duì)象實(shí)例媚污。和這些OO語言不同舀瓢，JavaScript中是沒有類的，又或者說原型對(duì)象就是JavaScript中的類耗美。但是沒有類的JavaScript是如何創(chuàng)建對(duì)象呢京髓？退一步講，在JavaScript中商架，對(duì)象到底是什么堰怨？

理解對(duì)象的本質(zhì)

ECMA中關(guān)于對(duì)象的定義

對(duì)象就是無序?qū)傩缘募希瑢傩缘闹悼梢允腔局瞪呙瘮?shù)或者其他對(duì)象

通過JavaScript提供的Ojbect()函數(shù)备图，可以創(chuàng)建出一個(gè)簡單的對(duì)象實(shí)例

var person = new Object();
person.name = "fuckJapan";
person.age = 21;
person.sayHello = function () {
    alert(this.name)
}

創(chuàng)建了一個(gè)person對(duì)象，person有三個(gè)屬性赶袄，其中name和age是基本值揽涮，sayHello是一個(gè)函數(shù)。

這種寫法可以用字面值對(duì)象重寫為：

var person = {
    name:"fuckJapan",
    age:21,
    sayHello:function () {
        alert(this.name)
    }
};

這種語法看起來更加 封裝

上面兩種創(chuàng)建對(duì)象的方式饿肺，有點(diǎn)像手工作坊蒋困，每創(chuàng)建一次對(duì)象都要重新給對(duì)象添加屬性，賦值唬格，不勝其煩。怎么解決颜说？進(jìn)工廠购岗，上生產(chǎn)線。

工廠模式

工廠模式抽象出創(chuàng)建對(duì)象的工程门粪。既然JavaScript中沒有類喊积，所以就用函數(shù)代替，類似這樣：

function createPerson(name, age, job) {
    var obj = new Object();
    obj.name = name;
    obj.age = age;
    obj.job = job;
    obj.sayHello = function () {
        alert(this.name);
    }
    return obj;
}
var person1 = createPerson("fuckJapan1",21,"student");
var person2 = createPerson("fuckJapan2",22,"teacher");

有了生產(chǎn)線玄妈，工人們?cè)僖膊挥糜H自動(dòng)手了乾吻，直接把原料放入函數(shù)髓梅，duang！一個(gè)person绎签，兩個(gè)person枯饿，統(tǒng)統(tǒng)new出來。工人解放了雙手诡必，提高了生產(chǎn)力奢方，效率蹭蹭上升。

我是誰爸舒，我來自哪里蟋字？

雖然工廠模式解決了創(chuàng)建多個(gè)類似對(duì)象的問題，但是卻沒有解決對(duì)象識(shí)別的問題扭勉。怎么辦鹊奖？

構(gòu)造函數(shù)模式

構(gòu)造函數(shù)和普通的函數(shù)沒有任何區(qū)別，只是用new調(diào)用時(shí)會(huì)產(chǎn)生特殊的效果涂炎。另外構(gòu)造函數(shù)有一些約定的規(guī)定忠聚，比如首字母大寫。

function Person(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayHello = function () {
        alert(this.name);
    }
}
var person1 = new Person("fuckJapan1",21,"student");
var person2 = new Person("fuckJapan2",22,"teacher");

這種模式中璧尸，函數(shù)中并沒有顯示創(chuàng)建對(duì)象咒林，而是使用了 this 關(guān)鍵字給對(duì)象實(shí)例添加屬性。在構(gòu)造函數(shù)的結(jié)尾也沒有return爷光。在調(diào)用時(shí)垫竞，使用了new關(guān)鍵字。在用new調(diào)用構(gòu)造函數(shù)時(shí)蛀序，一共做了這么幾件事：

• 分配對(duì)象內(nèi)存欢瞪，創(chuàng)建新對(duì)象
• 將這個(gè)對(duì)象和this綁定，this指向這個(gè)對(duì)象
• 執(zhí)行構(gòu)造過程并返回對(duì)象（在構(gòu)造函數(shù)末尾返回任何東西都不會(huì)起作用）

為什么這種模式解決了對(duì)象識(shí)別的問題呢徐裸？別著急遣鼓，這是因?yàn)樵?code>person1和person2中還包含一個(gè)名為constructor的屬性，這個(gè)屬性指向構(gòu)造函數(shù)Person重贺。從此person1骑祟，person2不再是三無產(chǎn)品，是可溯源的正品气笙，它們是由一個(gè)名為Person的構(gòu)造工廠生產(chǎn)的次企。

alert(person1.constructor == Person)//true
alert(person2.constructor == Person)//true
alert(person1.constructor == person2.constructor)//true

alert(person1 instanceof Person)//true
alert(person2 instanceof Person)//true
alert(person1 instanceof Object)//true
alert(person2 instanceof Object)//true

person1和person2為什么都是Object類型，這是因?yàn)樵?code>JavaScript中所有的對(duì)象都有一個(gè)共同的祖先Object

不走尋常路潜圃，把構(gòu)造函數(shù)當(dāng)做普通函數(shù)調(diào)用

Person("fuckJapan",23,"student");
alert(window.name);//fuckJapan

由于如果在瀏覽器中執(zhí)行缸棵，則構(gòu)造函數(shù)中的屬性被添加到window對(duì)象中

指定作用域

var obj = new Object();
Person.call(obj,"fuckJapanAgain",25,"student");
alert(obj.name);//fuckJapanAgain
alert(obj instanceof Person)//false

這種偷雞摸狗的調(diào)用方法，就會(huì)導(dǎo)致生產(chǎn)出來的對(duì)象沒有廠家

構(gòu)造函數(shù)雖然解決了對(duì)象的識(shí)別問題谭期，但是卻沒有解決對(duì)象方法的重復(fù)創(chuàng)建問題堵第，person1和person2中的sayHello方法是兩個(gè)完全不同的方法吧凉，這是完全沒有必要的

alert(person1.sayHello == person2.sayHello)//false

補(bǔ)救措施，將方法拿到外面踏志，指向全局函數(shù)

function Person(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayHello = sayHello;
}

function sayHello() {
    alert(this.name);
}

暫時(shí)解決了方法重復(fù)創(chuàng)建的問題阀捅，可是，把自己的方法拿到外面這種方式總是不妥的狰贯，全局作用域中的函數(shù)卻是特定對(duì)象的方法也搓，這太詭異了吃衅。而且方法少了還好說意蛀，多了就太亂了。

原型模式

每個(gè)函數(shù)都有一個(gè)名為prototype的屬性胡陪，指向函數(shù)的原型對(duì)象摸柄，類似OC中的類對(duì)象颤练。原型對(duì)象中保存著創(chuàng)建對(duì)象實(shí)例共享的方法和屬性。

function Person() {
}
Person.prototype.name = "fuckJapan";
Person.prototype.age = 29;
Person.prototype.job = "student";
Person.prototype.sons = ["son1","son2"];
Person.prototype.sayName = function () {
    alert(this.name);
}
var person1 = new Person();
var person2 = new Person();
alert(person1.name);//fuckJapan
alert(person2.name);//fuckJapan
alert(person1.sayName == person2.sayName);//true

構(gòu)造函數(shù)變成了空函數(shù)驱负，原型對(duì)象可以看做是對(duì)象的模板嗦玖，所有對(duì)象生成時(shí)，默認(rèn)都有這些屬性和對(duì)應(yīng)的值跃脊，其中引用類型是所有對(duì)象共享宇挫，非引用類型都是獨(dú)立的存儲(chǔ)。這樣雖然解決了每個(gè)對(duì)象實(shí)例方法重新創(chuàng)建的問題酪术，但又帶來了新的問題器瘪，數(shù)據(jù)紊亂，其實(shí)不光這樣一個(gè)問題绘雁，還有創(chuàng)建出的對(duì)象屬性還需要一個(gè)個(gè)賦值橡疼，構(gòu)造函數(shù)根本沒什么用

person1.name = "fuckJapanAgain";
alert(person1.name);//fuckJapanAgain
alert(person2.name);//fuckJapan

基本類型的并沒有受影響

person1.sons.push("son3");
alert(person1.sons);//son1,son2,son3
alert(person2.sons);//son1,son2,son3

由于引用類型是所有對(duì)象共享，所以數(shù)據(jù)亂了

說了這么多了庐舟，這個(gè)也有問題欣除，那個(gè)也有問題，那么到底該怎么做呢挪略？

組合使用構(gòu)造函數(shù)和原型模式

在構(gòu)造函數(shù)中創(chuàng)建每個(gè)對(duì)象需要單獨(dú)使用的屬性历帚，比如sons。在原型中創(chuàng)建所有對(duì)象共享的屬性杠娱，比如sayHello挽牢。

對(duì)象實(shí)例中在構(gòu)造函數(shù)中創(chuàng)建的屬性，每個(gè)都保留單獨(dú)的副本墨辛，而在原型中創(chuàng)建的引用類型屬性都共享同一份引用卓研。同時(shí)這種模式還支持傳遞參數(shù)趴俘，可謂一舉兩得睹簇。

function Person(name,age,job) {
    this.name = name;
    this.age = age;
    this.job = job;
    this.sons = ["son1","son2"];
}

Person.prototype = {
    constructor:Person,
    sayHello:function () {
        alert(this.name);
    }
}

var person1 = new Person("fuckJapan1",21,"student");
var person2 = new Person("fuckJapan2",26,"teacher");

person1.sons.push("son3");
alert(person1.sons);//son1,son2,son3
alert(person2.sons);//son1,son2

alert(person1.sayHello == person2.sayHello);//true

所有問題差不多都幾乎是完美解決奏赘，這就是JavaScript中神奇的『類』。

除此之外太惠，還有動(dòng)態(tài)原型模式磨淌，寄生構(gòu)造函數(shù)模式，穩(wěn)妥構(gòu)造函數(shù)模式凿渊。讀者自己去研究梁只。

說到面向?qū)ο螅仨氁f的就是繼承埃脏，JavaScript中的「類」已經(jīng)很神奇了搪锣，作為面向?qū)ο筇匦灾坏睦^承則更加神奇，各種花式繼承干到你哭彩掐。

欲知繼承如何构舟，且聽下回分解...