js设计模式——建造者模式和单例模式

1、建造者模式

建造者：将一个复杂的构建层与其表示层相互分离，同样的构建过程可采用不同的表示。

其实就是将一个复杂的对象分解成多个简单的对象来进行构建，不仅仅关注于创建的结果，更关注于创建的细节。

特点：

1.分步创建一个复杂的对象
2.解耦封装过程和具体创建组件
3.无需关心组件如何组装
复制代码

var Human = function(options) {
  this.skill = options && options.skill || '保密'
  this.hobby = options && options.hobby || '保密'
}
Human.prototype = {
  getSkill() {
    return this.skill
  },
  getHobby() {
    return this.hobby
  }
}
var Name = function(name) {
  var that = this;
  (function(name, that) {
    that.wholdName = name
    if (name.indexOf(' ') > -1) {
      that.firstName = name.slice(0, name.indexOf(' '))
      that.secondName = name.slice(name.indexOf(' '))
    }
  })(name, that)
}
var Work = function(work) {
  var that = this;
  (function(work, that) {
    switch (work) {
      case 'code':
        that.work = '程序员';
        that.workDescript = '沉醉于代码世界';
        break;
      case 'UI':
        that.work = '设计师';
        that.workDescript = '设计更似一种艺术';
        break;
    }
  })(work, that)
}
Work.prototype.changeWork = function(work) {
  this.work = work
}
Work.prototype.changWorkDescript = function(workDescript) {
  this.workDescript = workDescript
}
//建造者的类通过对三个类的组合来进行创建
var Person = function(name, work) {
  var _person = new Human()
  _person.name = new Name(name)
  _person.work = new Work(work)
  return _person
}
var person = Person('xiaoping buxiao', 'code')
console.log(person)
复制代码

2、单例模式

保证一个类仅有一个实例，并提供一个访问它的全局访问点。

先看下面的例子：

var myBadSingleton = (function() {
  var instance;
  function init() {
    var privateRandomNumber = Math.random()
    return {
      getRendomNumber: function() {
        return privateRandomNumber
      }
    }
  }
  return {
    getInstance: function() {
      instance = init()
      return instance
    }
  }
})()
var badSingA = myBadSingleton.getInstance()
var badSingB = myBadSingleton.getInstance()
console.log(badSingA.getRendomNumber() === badSingB.getRendomNumber())//false
复制代码

此时每次调用时都重新返回了一个对象，不仅仅会增加对内存的开销。同时，当我们第二次调用getRendomNumber时，返回的已经不是我们想要的数据了。此时就需要用到单例模式。

var mySingleton = (function() {
  var instance;
  function init() {
    //私有变量和方法
    function privateMethod() {
      console.log('I am private')
    }
    var privateVariable = 'I also private'
    var privateRandomNumber = Math.random()
    return {
      //共有变量和方法
      publicMethod: function() {
        console.log('The public can see me!')
      },
      publicVarible: 'I am also public',
      getRendomNumber: function() {
        return privateRandomNumber
      }
    }
  }
  return {
    getInstance: function() {
      //获取Singleto的实例，如果有没有就创建，有就直接方法
      if (!instance) {
        instance = init()
      }
      return instance
    }
  }
})()

var singA = mySingleton.getInstance()
var singB = mySingleton.getInstance()
console.log(singA.getRendomNumber() === singB.getRendomNumber()) //true
复制代码

当在系统中确实需要一个对象来协调其他对象时，singleton模式确实时很有必要的。

var SingletonTester = (function() {
  //options包含singleton所需信息的对象
  function SingleTon(options) {
    options = options || {}
    this.name = 'SingletonTester'
    this.pointX = options.pointX || 6
    this.pointY = options.pointY || 10
  }
  var instance;
  var _static = {
    name: 'SingletonTester',
    getInstance: function(options) {
      if (instance === undefined) {
        instance = new SingleTon(options)
      }
      return instance
    }
  }
  return _static
})()
var singletonTest = SingletonTester.getInstance({pointX:5})
console.log(singletonTest)
复制代码

5、参考资料

《JavaScript设计模式 张容铭》

《JavaScript设计模式 》Addy Osmani著 徐涛译版

6、结束语

最近在看有关js设计模式的知识，整理出来作为笔记，如果错误，欢迎大家指正，谢谢?