JavaScript設(shè)計(jì)模式--簡(jiǎn)單工廠模式定義與應(yīng)用案例詳解

更新時(shí)間：2020年05月23日 08:37:58 作者：WFaceBoss

這篇文章主要介紹了JavaScript設(shè)計(jì)模式--簡(jiǎn)單工廠模式定義與應(yīng)用,結(jié)合具體案例形式詳細(xì)分析了JavaScript設(shè)計(jì)模式中簡(jiǎn)單工廠模式基本概念、定義、用法與相關(guān)注意事項(xiàng),需要的朋友可以參考下

一，介紹

工廠模式創(chuàng)建對(duì)象（視為工廠里的產(chǎn)品）時(shí)無需指定創(chuàng)建對(duì)象的具體類。

工廠模式定義一個(gè)用于創(chuàng)建對(duì)象的接口，這個(gè)接口由子類決定實(shí)例化哪一個(gè)類。該模式使一個(gè)類的實(shí)例化延遲到了子類。而子類可以重寫接口方法以便創(chuàng)建的時(shí)候指定自己的對(duì)象類型。

在這里將工廠簡(jiǎn)單分為三種：

（1）簡(jiǎn)單工廠：通過第三方的類完成松耦合的任務(wù)。
（2）復(fù)雜工廠：通過把實(shí)例化的任務(wù)交給子類來完成的，用以到達(dá)松耦合的目的。
（3）超級(jí)工廠：通過eval()來完成智能工廠。

工廠的目的：在于判斷接口最終用哪個(gè)類實(shí)例化（故與接口密不可分）。
使用工廠最終達(dá)到的效果是：多態(tài)，和類與類之間的松耦合。

二，正文部分

工廠模式與接口是密不可分的所以我們需要先引入接口文件和繼承類文件

（1）接口文件：

//定義一個(gè)靜態(tài)方法來實(shí)現(xiàn)接口與實(shí)現(xiàn)類的直接檢驗(yàn)
//靜態(tài)方法不要寫出Interface.prototype ,因?yàn)檫@是寫到接口的原型鏈上的
//我們要把靜態(tài)的函數(shù)直接寫到類層次上
//(1)定義一個(gè)接口類
var Interface=function (name,methods) {//name：接口名字
  if(arguments.length<2){
    alert("必須是兩個(gè)參數(shù)")
  }
  this.name=name;
  this.methods=[];//定義一個(gè)空數(shù)組裝載函數(shù)名
  for(var i=0;i<methods.length;i++){
    if(typeof methods[i]!="string"){
      alert("函數(shù)名必須是字符串類型");
    }else {
      this.methods.push( methods[i]);
    }
  }
};
Interface.ensureImplement=function (object) {
  if(arguments.length<2){
    throw new Error("參數(shù)必須不少于2個(gè)")
    return false;
  }
  for(var i=1;i<arguments.length;i++){
    var inter=arguments[i];
    //如果是接口就必須是Interface類型
    if(inter.constructor!=Interface){
      throw new Error("如果是接口類的話，就必須是Interface類型");
    }
    //判斷接口中的方法是否全部實(shí)現(xiàn)
    //遍歷函數(shù)集合
    for(var j=0;j<inter.methods.length;j++){
      var method=inter.methods[j];//接口中所有函數(shù)

      //object[method]傳入的函數(shù)
      //最終是判斷傳入的函數(shù)是否與接口中所用函數(shù)匹配
      if(!object[method]||typeof object[method]!="function" ){//實(shí)現(xiàn)類中必須有方法名字與接口中所用方法名相同
        throw new Error("實(shí)現(xiàn)類中沒有完全實(shí)現(xiàn)接口中的所有方法")
      }
    }
  }
}

（2）繼承文件

/*創(chuàng)建extend函數(shù)為了程序中所有的繼承操作*/
//subClass:子類 superClass：超類
function extend(subClass,superClass) {
  //1，使子類原型屬性等于父類的原型屬性

  //初始化一個(gè)中間空對(duì)象，目的是為了轉(zhuǎn)換主父關(guān)系
  var F = function () {};
  F.prototype = superClass.prototype;
  //2， 讓子類繼承F
  subClass.prototype = new F();
  subClass.prototype.constructor = subClass;
  //3，為子類增加屬性 superClass ==》原型鏈的引用
  subClass.superClass = superClass.prototype;
  //4，增加一個(gè)保險(xiǎn)，就算你的原型類是超類（Object）那么也要把你的構(gòu)造函數(shù)級(jí)別降下來
  if (superClass.prototype.constructor == Object.prototype.constructor) {
    superClass.prototype.constructor = superClass;
  }
}

通過下面的例子，逐步引進(jìn)工廠模式及改進(jìn)工廠模式

1，工廠模式的引入，

（1）創(chuàng)建接口對(duì)象

 var Pet=new Interface("Pet",["eat","run","sing","register"]);

（2）定義一個(gè)寵物店類并在prototype上進(jìn)行擴(kuò)展

 var PetShop=function () {}
  PetShop.prototype={
    //出售寵物的方法
    sellPet:function (kind) {
      //寵物對(duì)象
      var pet;
      //寵物種類
      switch (kind){
        case 'dog':
          pet=new Dog();
        break;
        case 'cat':
          pet=new Cat();
          break;
        case 'pig':
          pet=new Pig();
          break;
        default:
          pet=new Bird();
      }
      //驗(yàn)證接口 
     Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)現(xiàn)接口Pet里面全部的方法  （對(duì)象，接口）
     pet.eat();
     pet.register();
     return pet;

    }
  }

（3）分析寵物的一些特點(diǎn)可以將一些公共的部分提取出來（這里只是簡(jiǎn)單的提?。?/p>

  //基類 有共同的提出來
  function basePet() {
    this.register=function () {
      document.write("寵物登記...<br>");
    }
    this.eat=function () {
      document.write("寵物吃飯...<br>");
    }
  }

（4）各個(gè)實(shí)現(xiàn)類 ---這里是各種動(dòng)物

  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口部分
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }

  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口部分
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口部分
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口部分
    this.run=function () {
      document.write("小鳥跑......<br>")
    }
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }

（5）各個(gè)實(shí)現(xiàn)類繼承基類

//繼承
extend(Dog,basePet);
extend(Cat,basePet);
extend(Pig,basePet);
extend(Bird,basePet);

（6）創(chuàng)建寵物的開始賣寵物

var newPetShop=new PetShop();
  var flowerPig=newPetShop.sellPet("pig");
  flowerPig.run();

結(jié)果為：

總結(jié)一下，上述好像沒怎么體現(xiàn)有關(guān)工廠之類的，我們應(yīng)該注意到這么一個(gè)問題就是：當(dāng)需要增加一個(gè)新品種寵物時(shí)，我們需要修改 '寵物店類'，耦合度較高。

為了解決這個(gè)問題我們使用簡(jiǎn)單工廠模式來解決。

2，簡(jiǎn)單工廠模式（針對(duì)上述的改進(jìn)）

（1）接口文件與繼承文件的的引入同上面

（2）靜態(tài)工廠

//使用工廠方式創(chuàng)建寵物對(duì)象 
// 靜態(tài)工廠
  var factoryPet={
    //出售寵物的方法
    getPet:function (kind) {
      //寵物對(duì)象
      var pet;
      //寵物種類
      switch (kind){
        case 'dog':
          pet=new Dog();
          break;
        case 'cat':
          pet=new Cat();
          break;
        case 'pig':
          pet=new Pig();
          break;
        default:
          pet=new Bird();
      }
      //驗(yàn)證接口
      Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
      return pet;
    }
  }

（3）利用工廠創(chuàng)建寵物店對(duì)象

 var factoryPetShop=function () {}
  factoryPetShop.prototype={
    getPet:function (kind) {
      var pet=factoryPet.getPet(kind);
      pet.eat();
      pet.register();
      return pet;
    }
  }

（4）從寵物店購(gòu)買寵物實(shí)現(xiàn)

 var newPetShop=new factoryPetShop();
  var flowerCat=newPetShop.getPet("cat");
  flowerCat.sing();

（5）使用簡(jiǎn)單工廠實(shí)現(xiàn)的全部代碼（數(shù)字標(biāo)號(hào)表示其思考的先后順序）

(function () {
  //(2)接口調(diào)用
  var Pet=new Interface("Pet",["eat","run","sing","register"]);

  //（3）基類 分析后有共同的提出來作為基類
  function basePet() {
    this.register=function () {
      document.write("寵物登記。。。。<br>");
    }
    this.eat=function () {
      document.write("寵物吃飯。。。。<br>");
    }
  }
  //（4）實(shí)現(xiàn)類 繼承基類+接口實(shí)現(xiàn)
  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }
  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小鳥跑......<br>")
    }
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }
  //繼承
  extend(Dog,basePet);
  extend(Cat,basePet);
  extend(Pig,basePet);
  extend(Bird,basePet);


  //（1）使用工廠方式創(chuàng)建寵物對(duì)象
  // 靜態(tài)工廠
  var factoryPet={
    //出售寵物的方法
    getPet:function (kind) {
      //寵物對(duì)象
      var pet;
      //寵物種類
      switch (kind){
        case 'dog':
          pet=new Dog();
          break;
        case 'cat':
          pet=new Cat();
          break;
        case 'pig':
          pet=new Pig();
          break;
        default:
          pet=new Bird();
      }
      //驗(yàn)證接口
      Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
      return pet;
    }
  }
  //（5）利用工廠的寵物店對(duì)象（寵物店買寵物）
  var factoryPetShop=function () {}
  factoryPetShop.prototype={
    getPet:function (kind) {
      var pet=factoryPet.getPet(kind);
      pet.eat();
      pet.register();
      return pet;
    }
  }
//（6）從寵物店購(gòu)買寵物
  var newPetShop=new factoryPetShop();//寵物工廠
  var flowerCat=newPetShop.getPet("cat");//從寵物工廠中得到寵物
  flowerCat.sing();

})()

總結(jié)一下，上述看似完美，但是任有問題存在：比如說：張三的寵物店想賣哈士奇，李四的寵物店想賣鳥時(shí)，這樣的話，寵物都是通過一個(gè)工廠生產(chǎn)的，并不一定滿足各個(gè)賣家的需求。

所以我們需要根據(jù)各個(gè)廠家的需求，有不同的工廠，各個(gè)賣家可以根據(jù)自己需求使用不同的工廠（其實(shí)是利用不同子類實(shí)現(xiàn)各自合適的工廠），用于滿足每個(gè)寵物店的不同。

于是我們有了復(fù)雜的工廠用來解決該問題。

3，復(fù)雜工廠：通過把實(shí)例化的任務(wù)交給子類來完成的，用以到達(dá)松耦合的目的。

此處同樣是根據(jù)上述進(jìn)行改進(jìn)的，還是簡(jiǎn)單的說明一下實(shí)現(xiàn)過程

（1）在html中將接口文件的引進(jìn)，代碼為

//定義一個(gè)靜態(tài)方法來實(shí)現(xiàn)接口與實(shí)現(xiàn)類的直接檢驗(yàn)
//靜態(tài)方法不要寫出Interface.prototype ,因?yàn)檫@是寫到接口的原型鏈上的
//我們要把靜態(tài)的函數(shù)直接寫到類層次上
//定義一個(gè)接口類
var Interface=function (name,methods) {//name：接口名字
  if(arguments.length<2){
    alert("必須是兩個(gè)參數(shù)")
  }
  this.name=name;
  this.methods=[];//定義一個(gè)空數(shù)組裝載函數(shù)名
  for(var i=0;i<methods.length;i++){
    if(typeof methods[i]!="string"){
      alert("函數(shù)名必須是字符串類型");
    }else {
      this.methods.push( methods[i]);
    }
  }
};
Interface.ensureImplement=function (object) {
  if(arguments.length<2){
    throw new Error("參數(shù)必須不少于2個(gè)")
    return false;
  }
  for(var i=1;i<arguments.length;i++){
    var inter=arguments[i];
    //如果是接口就必須是Interface類型
    if(inter.constructor!=Interface){
      throw new Error("如果是接口類的話，就必須是Interface類型");
    }
    //判斷接口中的方法是否全部實(shí)現(xiàn)
    //遍歷函數(shù)集合
    for(var j=0;j<inter.methods.length;j++){
      var method=inter.methods[j];//接口中所有函數(shù)

      //object[method]傳入的函數(shù)
      //最終是判斷傳入的函數(shù)是否與接口中所用函數(shù)匹配
      if(!object[method]||typeof object[method]!="function" ){//實(shí)現(xiàn)類中必須有方法名字與接口中所用方法名相同
        throw new Error("實(shí)現(xiàn)類中沒有完全實(shí)現(xiàn)接口中的所有方法")
      }
    }
  }
}

（2）在html中將繼承文件引入，代碼如下，

/*創(chuàng)建extend函數(shù)為了程序中所有的繼承操作*/
//subClass:子類 superClass：超類
function extend(subClass,superClass) {
  //1，使子類原型屬性等于父類的原型屬性

  //初始化一個(gè)中間空對(duì)象，目的是為了轉(zhuǎn)換主父關(guān)系
  var F = function () {};
  F.prototype = superClass.prototype;
  //2， 讓子類繼承F
  subClass.prototype = new F();
  subClass.prototype.constructor = subClass;
  //3，為子類增加屬性 superClass ==》原型鏈的引用
  subClass.superClass = superClass.prototype;
  //4，增加一個(gè)保險(xiǎn)，就算你的原型類是超類（Object）那么也要把你的構(gòu)造函數(shù)級(jí)別降下來
  if (superClass.prototype.constructor == Object.prototype.constructor) {
    superClass.prototype.constructor = superClass;
  }
}

（3）分析各個(gè)類提出相同的部分作為基類，基類代碼如下

//基類 分析后有共同的提出來作為基類
  function basePet() {
    this.register=function () {
      document.write("寵物登記。。。。<br>");
    };
    this.eat=function () {
      document.write("寵物吃飯。。。。<br>");
    }
  }

（4）各個(gè)具體的實(shí)現(xiàn)類：繼承基類+接口實(shí)現(xiàn)

//各個(gè)寵物類（實(shí)現(xiàn)類） 繼承基類+接口實(shí)現(xiàn)
  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }
  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小鳥跑......<br>")
    };
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }

（5）實(shí)現(xiàn)類與基類的繼承實(shí)現(xiàn)，代碼如下（調(diào)用extend（））

extend(Dog,basePet);//動(dòng)物狗繼承基類
  extend(Cat,basePet);
  extend(Pig,basePet);
  extend(Bird,basePet);

（6）將商店抽取出來，做成抽象類，代碼如下

//把核心商店抽取出來
  var petShop=function () {};
    petShop.prototype={//模擬抽象類 需要被子類覆蓋
      getPet:function (kind){
        var pet=this.getpet(kind);
        pet.eat();
        pet.register();
        return pet;
      },
      getpet:function (model){
       throw new Error("該類是抽象類，不能實(shí)例化")

      }
    };

（7）利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) ，代碼如下

//利用子類來滿足之前的需求（多態(tài)）
  var oneShop=function () { }
    extend(oneShop,petShop);//繼承
    //覆寫方法
   oneShop.prototype.getpet=function (model) {
     //寵物對(duì)象
     var pet;
     //寵物種類
     switch (model){
       case 'dog':
         pet=new Dog();
         break;
       default:
         pet=new Bird();
     }
     //驗(yàn)證接口
     Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
     pet.eat();
     pet.register();
     return pet;
   };

同上，這個(gè)也是一個(gè)不同的子類

 twoShop=function () {};
  extend(twoShop,petShop);//商店的繼承
  //覆寫方法
   twoShop.prototype.getPet=function (model) {
     //寵物對(duì)象
     var pet;
     //寵物種類
     switch (kind){
       case 'pig':
         pet=new Pig();
         break;
       default:
         pet=new Bird();
     }
     //驗(yàn)證接口
     Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
     pet.eat();
     pet.register();
     return pet;
   };

（8）使用，實(shí)質(zhì)是子類對(duì)父類的實(shí)例化

這里實(shí)現(xiàn)其中一個(gè)寵物店，另外一個(gè)同理。

//子類對(duì)父類的實(shí)例化
  var jim=new oneShop();
   var pig= jim.getpet("dog");
    pig.run();
    pig.sing()

（9）上述代碼綜合在一起為，代碼如下

(function () {
  //(2)接口調(diào)用
  var Pet=new Interface("Pet",["eat","run","sing","register"]);

  //（1）基類 分析后有共同的提出來作為基類
  function basePet() {
    this.register=function () {
      document.write("寵物登記。。。。<br>");
    };
    this.eat=function () {
      document.write("寵物吃飯。。。。<br>");
    }
  }
  //（3）實(shí)現(xiàn)類 繼承基類+接口實(shí)現(xiàn)
  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }
  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小鳥跑......<br>")
    };
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }
   //繼承
  extend(Dog,basePet);//寵物的繼承
  extend(Cat,basePet);
  extend(Pig,basePet);
  extend(Bird,basePet);

  //（4）把核心商店抽取出來
  var petShop=function () {};
    petShop.prototype={//模擬抽象類 需要被子類覆蓋
      getPet:function (kind){
        var pet=this.getpet(kind);
        pet.eat();
        pet.register();
        return pet;
      },
      getpet:function (model){
       throw new Error("該類是抽象類，不能實(shí)例化")

      }
    };
     //（5）商店1 利用子類來滿足之前的需求（多態(tài)）
  var oneShop=function () { }
    extend(oneShop,petShop);//繼承
    //覆寫方法
   oneShop.prototype.getpet=function (model) {
     //寵物對(duì)象
     var pet;
     //寵物種類
     switch (model){
       case 'dog':
         pet=new Dog();
         break;
       default:
         pet=new Bird();
     }
     //驗(yàn)證接口
     Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
     pet.eat();
     pet.register();
     return pet;
   };

    //（5）商店2
  twoShop=function () {};
  extend(twoShop,petShop);//商店的繼承
  //覆寫方法
   twoShop.prototype.getPet=function (model) {
     //寵物對(duì)象
     var pet;
     //寵物種類
     switch (kind){
       case 'pig':
         pet=new Pig();
         break;
       default:
         pet=new Bird();
     }
     //驗(yàn)證接口
     Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
     pet.eat();
     pet.register();
     return pet;
   };
   //（6）使用 子類對(duì)父類的實(shí)例化
  var jim=new oneShop();//開寵物店
   var pig= jim.getpet("dog");//從寵物店得到寵物
    pig.run();//寵物功能
    pig.sing()

})();

注：代碼中的注釋編號(hào)表示其大概思考過程及實(shí)現(xiàn)順序。

總結(jié)一下，在該個(gè)模式中主要體現(xiàn)在多態(tài)多一點(diǎn)。現(xiàn)在我們將前面的各種綜合在一起使用JavaScript的eval()做一個(gè)智能化的工廠。

4，通過eval()實(shí)現(xiàn)智能化工廠

（1）接口文件和繼承文件的引入，如上述的一模一樣，這里將不再重復(fù)貼代碼了，直接開始我們的新東西吧。

（2）接口調(diào)用

 var Pet=new Interface("Pet",["eat","run","sing","register"]);

（3）將相同部分提取出來（簡(jiǎn)單的提?。?/p>

//基類 分析后有共同的提出來作為基類
  function basePet() {
    this.register=function () {
      document.write("寵物登記。。。。<br>");
    };
    this.eat=function () {
      document.write("寵物吃飯。。。。<br>");
    }
  }

（4）各動(dòng)物類

//實(shí)現(xiàn)類 繼承基類+接口實(shí)現(xiàn)
  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }
  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小鳥跑......<br>")
    };
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }

（5）實(shí)現(xiàn)各動(dòng)物類繼承基類

//繼承
  extend(Dog,basePet);
  extend(Cat,basePet);
  extend(Pig,basePet);
  extend(Bird,basePet);

（6）將商店核心抽取出來，做成一個(gè)抽象類，代碼如下，

var petShop=function () {};
  petShop.prototype={//模擬抽象類 需要被子類覆蓋
    getPet:function (kind){
      var pet=this.getpet(kind);
      pet.eat();
      pet.register();
      return pet;
    },
    getpet:function (model){
      throw new Error("該類是抽象類，不能實(shí)例化")

    }
  };
//這里是做成抽象類其中的getpet方法是通過子類實(shí)現(xiàn)的。

（7）做一個(gè)智能工廠

  //(5)智能工廠 只負(fù)責(zé)生成寵物
  var PetFactory={
    sellPet:function (kind) {
      var pet;
      pet=eval("new "+kind+"()");
      Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
      return pet;
    }
  }

（8）利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) ，代碼如下

其中一個(gè)子類

//利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) （多態(tài)）
  var oneShop=function () { };
  extend(oneShop,petShop);//繼承
  //覆寫方法
  oneShop.prototype.getpet=function (model) {
    //寵物對(duì)象
    var pet=null;
    //寵物種類
    var pets=["Dog","Cat","Bird"];//商店自己擁有的寵物 寵物貨架
    for(v in pets){//循環(huán)出索引
      if(pets[v]==model){//model是我們自己傳遞過來需要?jiǎng)?chuàng)建的寵物
      pet=PetFactory.sellPet(model);
        //驗(yàn)證接口
    Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
        pet.eat();
        pet.register();
        break;
      }
    }
    return pet;

另一個(gè)子類

//（商店2）利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) （多態(tài)）
  twoShop=function () {};
  extend(twoShop,petShop);//商店的繼承
  //覆寫方法
  twoShop.prototype.getPet=function (model) {
    //寵物對(duì)象
    var pet=null;
    //寵物種類
    var pets=["Pig"];//商店自己擁有的寵物
    for(v in pets){//循環(huán)出索引
      if(pets[v]==model){
        pet=PetFactory.sellPet(model);
        //驗(yàn)證接口
        Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
        pet.eat();
        pet.register();
        break;
      }
    }
    return pet;
  };

（9）實(shí)現(xiàn)開寵物店賣寵物

這里我們來開第二個(gè)商店，賣Pig

 var shop=new twoShop();//創(chuàng)建商店
 var pet=shop.getPet("Pig");//從商店中得到寵物
   pet.run();//寵物的功能

（10）智能化工廠的代碼

(function () {
  //(1)接口調(diào)用
  var Pet=new Interface("Pet",["eat","run","sing","register"]);
  //（2）基類 分析后有共同的提出來作為基類
  function basePet() {
    this.register=function () {
      document.write("寵物登記。。。。<br>");
    };
    this.eat=function () {
      document.write("寵物吃飯。。。。<br>");
    }
  }
  //（3）各個(gè)動(dòng)物類（實(shí)現(xiàn)類） 繼承基類+接口實(shí)現(xiàn)
  function Dog() {
    Dog.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小狗跑......<br>")
    }
    this.sing=function () {
      document.write("小狗唱歌......<br>")
    }
  }
  function Cat() {
    Cat.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小貓跑......<br>")
    }
    this.sing=function () {
      document.write("小貓唱歌......<br>")
    }
  }
  function Pig() {
    Pig.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小豬跑......<br>")
    }
    this.sing=function () {
      document.write("小豬唱歌......<br>")
    }
  }
  function Bird() {
    Bird.superClass.constructor.call(this);//繼承父類
    //實(shí)現(xiàn)接口
    this.run=function () {
      document.write("小鳥跑......<br>")
    };
    this.sing=function () {
      document.write("小鳥唱歌......<br>")
    }
  }
  //繼承
  extend(Dog,basePet);
  extend(Cat,basePet);
  extend(Pig,basePet);
  extend(Bird,basePet);
  //(4)把核心商店抽取出來
  var petShop=function () {};
  petShop.prototype={//模擬抽象類 需要被子類覆蓋
    getPet:function (kind){
      var pet=this.getpet(kind);
      pet.eat();
      pet.register();
      return pet;
    },
    getpet:function (model){
      throw new Error("該類是抽象類，不能實(shí)例化")

    }
  };

  //(5)智能工廠 只負(fù)責(zé)生成寵物
  var PetFactory={
    sellPet:function (kind) {
      var pet;
      pet=eval("new "+kind+"()");
      Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
      return pet;
    }
  }

  //(6)（商店1）利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) （多態(tài)）
  var oneShop=function () { };
  extend(oneShop,petShop);//繼承
  //覆寫方法
  oneShop.prototype.getpet=function (model) {
    //寵物對(duì)象
    var pet=null;
    //寵物種類
    var pets=["Dog","Cat","Bird"];//商店自己擁有的寵物 寵物貨架
    for(v in pets){//循環(huán)出索引
      if(pets[v]==model){//model是我們自己傳遞過來需要?jiǎng)?chuàng)建的寵物
      pet=PetFactory.sellPet(model);
        //驗(yàn)證接口
    Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
        pet.eat();
        pet.register();
        break;
      }
    }
    return pet;
  };

  //（商店2）利用子類來滿足各個(gè)商家的不同類型寵物店的實(shí)現(xiàn) （多態(tài)）
  twoShop=function () {};
  extend(twoShop,petShop);//商店的繼承
  //覆寫方法
  twoShop.prototype.getPet=function (model) {
    //寵物對(duì)象
    var pet=null;
    //寵物種類
    var pets=["Pig"];//商店自己擁有的寵物
    for(v in pets){//循環(huán)出索引
      if(pets[v]==model){
        pet=PetFactory.sellPet(model);
        //驗(yàn)證接口
        Interface.ensureImplement(pet,Pet);//判斷pet對(duì)象是否全部實(shí)行接口Pet里面全部的方法
        pet.eat();
        pet.register();
        break;
      }
    }
    return pet;
  };
//（7）開寵物店賣寵物
  var shop=new twoShop();
 var pet=shop.getPet("Pig");
   pet.run();

})();

總結(jié)一下，該種智能化工廠的特點(diǎn)體現(xiàn)在我們需要什么寵物店時(shí)，我們可以直接通過智能化工廠創(chuàng)建。很完美。