JS 建造者模式

1. 简介

在软件系统中，有时候面临着“一个复杂对象”的建立工做，其一般由各个部分的子对象用必定的算法构成；因为需求的变化，这个复杂对象的各个部分常常面临着剧烈的变化，可是将它们组合在一块儿的算法确相对稳定。如何应对这种变化？如何提供一种“封装机制”来隔离出“复杂对象的各个部分”的变化，从而保持系统中的“稳定构建算法”不随着需求改变而改变？这就是要说的建造者模式。

建造者模式(Builder pattern)，将一个复杂对象的构建层与其表示层相互分离，使得一样的构建过程能够采用不一样的表示。也就是说若是咱们用了建造者模式，那么用户就须要指定须要建造的类型就能够获得它们，而具体建造的过程和细节就不须要知道了。

在工厂模式中，对建立的结果都是一个完整的个体，咱们对参见的过程不为所知，只了解建立的结果对象。而在建造者模式中咱们关心的是对象的建立过程，所以咱们一般将建立对象的类模块化，这样使被建立的类的每个模块均可以获得灵活的运用和高质量的复用。

2. 实现

const Human = function(param) {
  this.skill = param && param.skill || '保密'
  this.hobby = param && param.hobby || '保密'
}
Human.prototype = {
  getSkill: function() {
    return this.skill
  },
  getHobby: function() {
    return this.hobby
  }
}

const Named = function(named) { 
  (function(named, that) {
    that.wholeName = named
    if (named.includes(' ')) {
      that.FirstName = named.slice(0, named.indexOf(' '))
      that.SecondeName = named.slice(named.indexOf(' '))
    }
  })(named, this)
}

const Work = function(work) {
  (function(work, that) {
    switch (work) {
      case 'code':
        that.work = '工程师'
        that.workDesc = '天天沉迷于编程'
        break
      case 'UE':
        that.work = '设计师'
        that.workDesc = '设计更像一种艺术'
        break
      default :
        that.work = work
        that.workDesc = '对不起，咱们不清楚您所选择职位的描述'
    }
  })(work, this)
}

Work.prototype.changeWork = function(work) {
  this.work = work
}

const Person = function(param, name, work) {    // 构造方法，不一样模块使用不一样建立过程
  const _person = new Human(param)
  _person.named = new Named(name)
  _person.work = new Work(work)
  return _person
}

const xiaoming = new Person({ skill: '耍帅', hobby: '装逼' }, 'xiao ming', 'code')
xiaoming.skill    // 耍帅
xiaoming.FirstName  // xiao
xiaoming.work    // 工程师

根据建造者的定义，表相便是回调，也就是说获取数据之后如何显示和处理取决于回调函数，相应地回调函数在处理数据的时候不须要关注是如何获取数据的，一样的例子也能够在jquery的ajax方法里看到，有不少回调函数（好比success, error回调等），主要目的就是职责分离。

一样再来一个jQuery的例子：$('<div class= "foo"> bar </div>')，咱们只须要传入要生成的HTML字符，而不须要关心具体的HTML对象是如何生产的。

3. 总结

建造者模式主要用于“分步骤构建一个复杂的对象”，在这其中“分步骤”是一个稳定的算法，而复杂对象的各个部分则常常变化，其优势是：建造者模式的“加工工艺”是暴露的，这样使得建造者模式更加灵活，而且建造者模式解耦了组装过程和建立具体部件，使得咱们不用去关心每一个部件是如何组装的。

这种方式对于总体对象类的拆分无疑增长告终构的复杂性，所以若是对象粒度很小，或者模块间的复用率很低而且变更不大，咱们最好仍是要建立总体对象。

---

本文是系列文章，能够相互参考印证，共同进步~

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：欢迎你们关注个人公众号【前端下午茶】，一块儿加油吧~

另外能够加入「前端下午茶交流群」微信群，长按识别下面二维码便可加我好友，备注加群，我拉你入群～