JS 抽象工廠模式

0. 簡介

抽象工廠模式(Abstract Factory)就是經過類的抽象使得業務適用於一個產品類簇的建立，而不負責某一類產品的實例。

JS中是沒有直接的抽象類的，abstract是個保留字，可是尚未實現，所以咱們須要在類的方法中拋出錯誤來模擬抽象類，若是繼承的子類中沒有覆寫該方法而調用，就會拋出錯誤。

const Car = function() { }
Car.prototype.getPrice = function() {return new Error('抽象方法不能調用')}

1. 實現

面向對象的語言裏有抽象工廠模式，首先聲明一個抽象類做爲父類，以歸納某一類產品所須要的特徵，繼承該父類的子類須要實現父類中聲明的方法而實現父類中所聲明的功能：

/**
* 實現subType類對工廠類中的superType類型的抽象類的繼承
* @param subType 要繼承的類
* @param superType 工廠類中的抽象類type
*/
const VehicleFactory = function(subType, superType) {
  if (typeof VehicleFactory[superType] === 'function') {
    function F() {
      this.type = '車輛'
    } 
    F.prototype = new VehicleFactory[superType]()
    subType.constructor = subType
    subType.prototype = new F()                // 由於子類subType不只須要繼承superType對應的類的原型方法，還要繼承其對象屬性
  } else throw new Error('不存在該抽象類')
}

VehicleFactory.Car = function() {
  this.type = 'car'
}
VehicleFactory.Car.prototype = {
  getPrice: function() {
    return new Error('抽象方法不可以使用')
  },
  getSpeed: function() {
    return new Error('抽象方法不可以使用')
  }
}

const BMW = function(price, speed) {
  this.price = price
  this.speed = speed
}
VehicleFactory(BMW, 'Car')        // 繼承Car抽象類
BMW.prototype.getPrice = function() {        // 覆寫getPrice方法
  console.log(`BWM price is ${this.price}`)
}
BMW.prototype.getSpeed = function() {
  console.log(`BWM speed is ${this.speed}`)
}

const baomai5 = new BMW(30, 99)
baomai5.getPrice()                          // BWM price is 30
baomai5 instanceof VehicleFactory.Car       // true

2. 總結

抽象類建立出的結果不是一個真實的對象實例，而是一個類簇，它指定了類的結構，這也就區別於簡單工廠模式建立單一對象，工廠模式建立多類對象。

經過抽象工廠，就能夠建立某個類簇的產品，而且也能夠經過instanceof來檢查產品的類別，也具有該類簇所必備的方法。

---

本文是系列文章，能夠相互參考印證，共同進步~

1. JS 抽象工廠模式
2. JS 工廠模式
3. JS 建造者模式
4. JS 原型模式
5. JS 單例模式
6. JS 回調模式
7. JS 外觀模式
8. JS 適配器模式
9. JS 利用高階函數實現函數緩存(備忘模式)
10. JS 狀態模式
11. JS 橋接模式
12. JS 觀察者模式

網上的帖子大多深淺不一，甚至有些先後矛盾，在下的文章都是學習過程當中的總結，若是發現錯誤，歡迎留言指出~

參考： 《Javascript 設計模式》 - 張榮銘

PS：歡迎你們關注個人公衆號【前端下午茶】，一塊兒加油吧~

另外能夠加入「前端下午茶交流羣」微信羣，長按識別下面二維碼便可加我好友，備註加羣，我拉你入羣～