JavaScript设计模式：六、工厂模式

序、设计模式分类
一、装饰者模式（原型链）
二、策略模式
三、代理模式
四、发布订阅模式
五、迭代器模式
六、工厂模式
七、外观模式
八、状态模式
九、单例模式
十、适配器模式

一、概述

1. 简单工厂模式

一、ES6 Class实现

大白话：通过不同的参数由工厂的构造函数返回不同对象。

工厂模式，通过传入不同短参数达到实例化不同的对象这一目的。比如: 有一天你去餐厅想吃宫保鸡丁，然后餐厅给你实例化了宫保鸡丁。

function 宫保鸡丁() {};
function 西红柿炒鸡蛋() {};
class Restaurant{
  constructor(type){
      switch (type) {
          case '宫保鸡丁':
              return new 宫保鸡丁()
              break;
          case '西红柿炒鸡蛋':
              return new 西红柿炒鸡蛋()
              break;
          default:
              throw "我们餐厅没有你要的菜不好意思，请出门左拐！！！" 
              break;
      }
  }
}
let mincedChicken= new Restaurant('宫保鸡丁');
let scrambledTomato = new Restaurant('西红柿炒鸡蛋');

二、原型实现

function A(){this.name = 'A'};
function B(){this.name = 'B'}; 
function C(){this.name = 'C'};
var BicycleShop = function() {};
BicycleShop.prototype = {
  sellBicycle: function(model) {
    var bicycle;
    switch (model) {
      case 'A':
        bicycle = new A(); break;
      case 'B':
        bicycle = new B(); break;
      case 'C':
        bicycle = new C(); break;
    }
    return bicycle;
  }
}
const shop = new BicycleShop();
const bicycle = shop.sellBicycle('A')
console.log(bicycle.name); // A

2. 复杂工厂模式

1) ES5原型实现

// 1. 定义一个抽象工厂
var BicycleShop = function() {};
BicycleShop.prototype = {
  sellBicycle: function(model) {
    var bicycle = this.createBicycle(model);
    return bicycle;
  },
  createBicycle: function(model) {
    throw new Error('必须通过子类的实例才能调用此方法，进货自行车');
  }
};
//- 2. 抽象工厂实现
// 2.1 先定义生产的产品
function OracleSpeedster(){} function OracleLowrider(){}
function OracleAlien(){} function OracleComfortCruiser(){}
// 2.2. 定义工厂类实现抽象工厂，处理继承关系
// Oracle 工厂
var OracleBicycleShop = function() {BicycleShop.call(this);};
OracleBicycleShop.prototype = Object.create(BicycleShop.prototype);
OracleBicycleShop.constrcutor = OracleBicycleShop;

OracleBicycleShop.prototype.createBicycle = function(model) {
  var bicycle;
  switch(model) {
    case 'speedster': 
      bicycle = new OracleSpeedster(); break;
    case 'lowrider':
      bicycle = new OracleLowrider(); break;
    case 'Alien':
      bicycle = new OracleAlien(); break;
    case 'comfort cruiser':
    default :
      bicycle = new OracleComfortCruiser(); break;
  }
  return bicycle;
}

// IBM工厂
function IBMSpeedster(){} function IBMLowrider(){};
function IBMAlien(){} function IBMComfortCruiser(){};
var IBMBicycleShop = function(){BicycleShop.call(this)};
IBMBicycleShop.prototype = Object.create(BicycleShop.prototype);
IBMBicycleShop.prototype.createBicycle = function(model) {
  var bicycle;
  switch(model) {
    case 'speedster': 
      bicycle = new IBMSpeedster(); break;
    case 'lowrider':
      bicycle = new IBMLowrider(); break;
    case 'Alien':
      bicycle = new IBMAlien(); break;
    case 'comfort cruiser':
    default :
      bicycle = new IBMComfortCruiser(); break;
  }
  return bicycle;
}

// Oracle 专卖店购买
var oracle = new OracleBicycleShop();
var yourNewBicycle = oracle.createBicycle("speedster");
console.log(yourNewBicycle); //OracleSpeedster {}
// IBM专卖带你购买
var ibm = new IBMBicycleShop();
var myNewBicycle = ibm.createBicycle("speedster");
console.log(myNewBicycle); //IBMSpeedster {}

2) es6-new.target属性的正确用法

new.target属性

ES6引入了new.target属性，用于确认当前作用的在哪个构造函数上。若没有通过new命令调用构造函数。 则new.target会返回undefined，否则返回当前构造函数。

实例

function Animal (name) {
  if(new.target !== undefined) {
    this.name = name;
  } 
  // else { throw new Error('必须使用new生成实例！'); }
}
var dog = new Animal('狗');
console.log(dog.__proto__); // {}
console.log(dog.name); // 狗
var b = Animal.call(Object.create(null), '猫');
console.log(b); // undefined
// TypeError: Cannot read properties of undefined (reading '__proto__')
console.log(b.__proto__);

3)ES6实现

class BicycleShop {
  constructor() {
    if(new.target.name === 'BicycleShop') {
      throw new Error('抽象类必须被实现使用');
    }
  }
  sellBicycle() {
    let bicycle = this.createBicycle(model);
    return bicycle;
  }
  createBicycle(model) {
    throw new Error('必须通过子类的实例才能调用此方法，进货自行车');
  }
}
class OracleSpeedster{} class OracleLowrider{}
class OracleAlien{} class OracleComfortCruiser{}
class OracleBicycleShop extends BicycleShop{
  createBicycle(model) {
    let bicycle = null;
    switch(model) {
      case 'speedster':
        bicycle = new OracleSpeedster(); break;
      case 'lowrider':
        bicycle = new OracleLowrider(); break;
      case 'alien':
        bicycle = new OracleAlien(); break;
      case 'comfort cruiser':
      default:
        bicycle = new OracleComfortCruiser();
    }
    return bicycle;
  }
}

class IBMSpeedster{} class IBMLowrider{}
class IBMAlien{} class IBMComfortCruiser{}
class IBMBicycleShop extends BicycleShop {
  createBicycle(model) {
    let bicycle = null;
    switch(model) {
      case 'speedster':
        bicycle = new IBMSpeedster(); break;
      case 'lowrider':
        bicycle = new IBMLowrider(); break;
      case 'alien':
        bicycle = new IBMAlien(); break;
      case 'comfort cruiser':
      default:
        bicycle = new IBMComfortCruiser(); 
    }
    return bicycle;
  }
}

const oracle =  new OracleBicycleShop();
const speedster = oracle.createBicycle('speedster');
console.log(speedster); // OracleSpeedster {}

const ibm = new IBMBicycleShop();
const lowrider = ibm.createBicycle('lowrider');
console.log(lowrider); //IBMLowrider {}