JavaScript设计模式之工厂模式学习

工厂模式就是定义了一个创建对象的接口，把创建的过程隐藏起来，让用户在使用的时候，只需调用这个接口创建对象，而不需要实例化这个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型。

1. 工厂模式类型

工厂模式有三种类型：

• 静态工厂模式
• 工厂方法模式
• 抽象工厂模式

1.1 静态工厂模式

静态工厂模式，又被称作简单工厂模式，就是根据用户输入的属性，来创建同一类对象。

动物园里有几类动物，dog，cat，bird等；他们有各自的叫声，各自的特殊能力，我们根据这，来写静态工厂模式的类

class AnimalFactory {
  constructor(params) {
  	const {name, speak } = params
  	this.name = name;
  	this.speak = speak;
  }

  static createAnimal(type) {
  	switch(type) {
  	  case 'dog':
  	  	return new AnimalFactory({
  	  	  name: '狗',
  	  	  speak() { console.log('汪汪汪～'); },
  	  	});
  	  	break;
 	  case 'cat':
 	  	return new AnimalFactory({
  	  	  name: '猫',
  	  	  speak() { console.log('喵喵喵～'); },
  	  	});
  	  	break;
 	  case 'bird':
 	  	return new AnimalFactory({
  	  	  name: '鸟',
  	  	  speak() { console.log('喳喳喳～'); },
  	  	});
  	  	break;
  	  default:
        throw new Error('参数错误, 可选参数:bird, cat, dog')
  	}
  }
}

const cat = AnimalFactory.createAnimal('cat');
const dog = AnimalFactory.createAnimal('dog');
const bird = AnimalFactory.createAnimal('bird');

上面的AnimalFactory就是一个静态工厂，它可以根据用户输入的参数，生成三个不同类型的实例。

• 优点：
  静态工厂模式的优点就是只要根据一个参数，就可以获得一个实例，不需要了解内部的创建过程。逻辑不复杂的情况下，只要传参正确就可以
• 缺点
  缺点也很明显，需要新类型的时候，需要修改工厂类，同时也不能逻辑太复杂，不能创建多类对象

1.2 工厂方法模式

工厂方法模式的是将实际创建对象的工作推迟到子类中，这样核心类就变成了抽象类。在添加新的类时就无需修改工厂类，只需要将子类注册进工厂类中即可。因为js里不支持抽象类，使用new.target 来处理。

class AnimalFactory {
  constructor(params) {
  	if(new.target === AnimalFactory) {
  	  throw new Error('抽象类不能实例化!');
  	}
  	const {name, speak } = params
  	this.name = name;
  	this.speak = speak;
  }
}

class CreateAnimal extends AnimalFactory {
  constructor(params) {
    super(params)
  }
  static create() {
  	switch(type) {
  	  case 'dog':
  	  	return new CreateAnimal({
  	  	  name: '狗',
  	  	  speak() { console.log('汪汪汪～'); },
  	  	});
  	  	break;
 	  case 'cat':
 	  	return new CreateAnimal({
  	  	  name: '猫',
  	  	  speak() { console.log('喵喵喵～'); },
  	  	});
  	  	break;
 	  case 'bird':
 	  	return new CreateAnimal({
  	  	  name: '鸟',
  	  	  speak() { console.log('喳喳喳～'); },
  	  	});
  	  	break;
  	  default:
        throw new Error('参数错误, 可选参数:bird, cat, dog')
  	}
  }
}

const cat = CreateAnimal.create('cat');
const dog = CreateAnimal.create('dog');
const bird = CreateAnimal.create('bird');

工厂方法模式就是将实例化延迟到了子类中，而且可以在子类中添加各种新的类型等。

1.3 抽象工厂模式

抽象工厂主要用于对类簇的创建，不直接生成实例，子类重写接口方法以便创建的时候指定自己的对象类型。抽象工厂其实是实现子类继承父类的方法。

因为是类簇，我们可以考虑，有动物园里的cat，dog，bird，分别属于猫科动物(CAT)，犬科动物(DOG)，和飞禽类动物(BIRD)，抽象工厂就是根据抽象工厂类，实例化一个动物类，然后再根据相应的类来声明对应的动物。

class AnimalTypeFactory {
  static createAnimalType(type) {
	switch (type) {
    case 'CAT':
      return CatFactory;
      break;
    case 'DOG':
      return DogFactory;
      break;
    case 'BIRD':
      return BirdFactory;
      break;
    default:
      throw new Error('参数错误, 可选参数:CAT, DOG, BIRD')
    }
  }
}

class CatFactory {
  name: '猫',
  speak() { console.log('喵喵喵～'); },
}
class DogFactory {
  name: '狗',
  speak() { console.log('汪汪汪～'); },
}
class BirdFactory {
  name: '鸟',
  speak() { console.log('喳喳喳～'); },
}

const CatClass = AnimalTypeFactory.createAnimalType('CAT');
const DogClass = AnimalTypeFactory.createAnimalType('DOG');
const BirdClass = AnimalTypeFactory.createAnimalType('BIRD');

let cat = new CatClass('cat');
let dog = new DogClass('dog');
let bird = new BirdClass('bird');

2. 应用场景

• JQuery里的$
• React的 createElement()