本文實(shí)例講述了JS中創(chuàng)建自定義類型的常用模式。分享給大家供大家參考，具體如下：

雖然在 ES6 中，已經(jīng)出了 class 的語(yǔ)法，貌似好像不用了解 ES5 中的這些老東西了，但是越深入學(xué)習(xí)，你會(huì)發(fā)現(xiàn)理解這些模式的重要性。

在本文中，我會(huì)描述 7 種常用的創(chuàng)建自定義類型的模式：工廠模式、構(gòu)造函數(shù)模式、原型模式、組合使用構(gòu)造函數(shù)模式、動(dòng)態(tài)原型模式、寄生構(gòu)造函數(shù)模式、穩(wěn)妥構(gòu)造函數(shù)模式。分別給出他們的示例代碼，并分析他們的利弊，方便讀者選擇具體的方式來(lái)構(gòu)建自己的自定義類型。

最后，我會(huì)指出 ES6 中的 class 語(yǔ)法，本質(zhì)上其實(shí)還是利用了組合使用構(gòu)造函數(shù)模式進(jìn)行創(chuàng)建自定義類型。

1. 工廠模式

廢話不多說(shuō)，先上工廠模式的實(shí)例代碼：

function createPerson(name, age, job){  var o = new Object();      // 創(chuàng)建對(duì)象  o.name = name;         // 賦予對(duì)象細(xì)節(jié)  o.age = age;          // 賦予對(duì)象細(xì)節(jié)  o.job = job;          // 賦予對(duì)象細(xì)節(jié)  o.sayName = function(){     // 賦予對(duì)象細(xì)節(jié)    alert(this.name);  };  return o;            // 返回該對(duì)象}var person1 = createPerson("Nicholas", 29, "Software Engineer");var person2 = createPerson("Greg", 27, "Doctor");

優(yōu)點(diǎn)：解決了創(chuàng)建多個(gè)相似對(duì)象的問(wèn)題；

缺點(diǎn)：沒(méi)有解決對(duì)象識(shí)別的問(wèn)題（即不知道這個(gè)對(duì)象是什么類型），對(duì)于對(duì)象的方法沒(méi)有做到復(fù)用。

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

function Person(name, age, job){  this.name = name;    // 對(duì)象的所有細(xì)節(jié)全部掛載在 this 對(duì)象下面  this.age = age;  this.job = job;  this.sayName = function(){    alert(this.name);  };}var person1 = new Person("Nicholas", 29, "Software Engineer");var person2 = new Person("Greg", 27, "Doctor");

說(shuō)到構(gòu)造函數(shù)模式就不得不提到 new 操作符了。我們來(lái)看看 new 這個(gè)操作符到底做了什么：

① 創(chuàng)建一個(gè)對(duì)象；
② 將構(gòu)造函數(shù)內(nèi)的 this 指向這個(gè)新創(chuàng)建的對(duì)象，同時(shí)將該函數(shù)的 prototype 的引用掛載在新對(duì)象的原型下；
③ 執(zhí)行函數(shù)內(nèi)的細(xì)節(jié)，也就是將屬性和方法掛載在新對(duì)象下；
④ 隱式的返回新創(chuàng)建的對(duì)象。

優(yōu)點(diǎn)：解決了對(duì)象識(shí)別的問(wèn)題；

缺點(diǎn)：對(duì)于自定義類型的方法每次都要新創(chuàng)建一個(gè)方法函數(shù)實(shí)例，沒(méi)有做到函數(shù)復(fù)用。如果把所有方法函數(shù)寫(xiě)到父級(jí)作用域中，是做到了函數(shù)復(fù)用，但同時(shí)方法函數(shù)只能在父級(jí)作用域的某個(gè)類型中進(jìn)行調(diào)用，這對(duì)于父級(jí)作用域有點(diǎn)名不副實(shí)，同時(shí)對(duì)于自定義引用類型沒(méi)有封裝性可言。

3. 原型模式

function Person(){}Person.prototype.name = "Nicholas";Person.prototype.age = 29;Person.prototype.job = "Software Engineer";Person.prototype.sayName = function(){  alert(this.name);};var person1 = new Person();person1.sayName();   //"Nicholas"var person2 = new Person();person2.sayName();   //"Nicholas"alert(person1.sayName == person2.sayName);   //true