JS设计模式（一）——有点不配称为设计模式的简单工厂模式

前言

如果在未来，你想成为高级架构师或者更上一层楼，那么js中的设计模式是必须得学会的。在js中有很多种设计模式，我们在接下来的日子会对这些设计模式一一进行学习，今天我们先来学习设计模式中的简单工厂模式。

简单工厂模式

大家看到标题可能会有点奇怪，为什么简单工厂模式有点不配称为设计模式呢？在大家的眼中，设计模式是一个非常高大上的词语，经常出现在面试官或者一些比较高级的书本上，而简单工厂模式虽然它是一种设计模式，但是它并没有想象中的那么难。相反，挺简单的，下面我们来看看简单工厂模式的定义。

简单工厂模式可以简单定义为下面一句话：

简单工厂模式：将创建对象的过程单独封装

下面我们来构建一个场景，在一家公司中，有很多的职位，老板让你创建两个职位分别是Coder和Product。我们听从老板的命令创建了下面三个构造函数：

function Coder(name, age) {
  this.name = name
  this.age = age
  this.career = 'corder'
  this.work = ['写代码', '改bug', '摸鱼']
}

function Product(name ,age) {
  this.name = name
  this.age = age
  this.career = 'product'
  this.work = ['做需求', '定会议室', '催更']
}

接下来呢老板通过面试，招进来了三个员工分别对应了上面两个个岗位，名字和年龄分别如下：小朱 20、牛哥 28。然后呢老板要求我们创建出来实例对象用来储存这两名员工的数据：

const coder = new Coder('小朱', 20)
const product = new Product('牛哥', 28)
console.log(coder);
console.log(product);

我们可以看到已经成功创建了，那么如果有很多的员工被招进来时，我们需要不断的调用不同的构造函数用来创建实例对象，这是很麻烦的。为了简化这一过程，我们可以重新定义一个函数用来封装这些构造函数：

function Factory(name, age, career) {
  switch (career) {
    case 'corder':
      return new Coder(name, age)
    case 'product':
      return new Product(name, age)  
  }
}
const coder = Factory('小朱', 20, 'corder')
const product = Factory('牛哥', 28, 'product')

这样我们就可以批量化的创建对象了。但是如果我们要添加很多新的岗位时，我们又要自己手动来增加很多新的构造函数，那么我们可不可以对上面的代码再进行简化呢？

我们通过观察上面代码可以知道，该公司的员工都有以下几个公共属性：name，age和career。只有work不同，这时候我们呢可以将这四个属性抽离出来创建一个User构造函数，并且根据不同USer的work从而创建不同的对象：

function User(name, age, career, work) {
  this.name = name
  this.age = age
  this.career = career
  this.work = work
}

function Factory(name, age, career) {
  let work = null
  switch (career) {
    case 'corder':
      work = ['写代码', '改bug', '摸鱼']
      break;
    case 'product':
      work = ['做需求', '定会议室', '催更']
      break;
    case 'boss':
      work = ['喝茶', '看报', '见客户']
      break;  
  }

  return new User(name, age, career, work)
}

在更新完了代码之后，我们如果以后想要再创建新的职位，只需要再switch中不断的增加case就行，不必重复增加构造函数，从而提高了代码的可读性和复用性。而这个将创建对象的过程单独封装的过程我们称之为简单工厂模式，因为它就像工厂一样可以批量化生产出来你想要的实例对象。

谢谢各位大佬们的观看，喜欢的话点个赞吧！