曾經(jīng)我做后端的時候，前端不加班，現(xiàn)在我做前端了，后端不加班。
曾經(jīng)我做后端的時候，被設計模式折磨，現(xiàn)在我做前端了，還tm得整這個。
我們（我）平復下心情，來看看前端常用的設計模式有哪些，以及在前端怎么還會用到設計模式。

單例模式

是保證一個類只有一個實例，并且提供一個訪問它的全局訪問點
解決問題：某些方法只允許執(zhí)行一次，比如記錄本地日志（為提高效率，不關閉日志文件，一直追加），因為在win下只允許一個線程打開文件，所以只能有一個實例去操作

var Single = (function () {
    var instance
    function getLogFile() {
    return fs.openSync('c:\\log.txt', 'w')
  }

  return {
    getInstance: function () {
      if (!instance) {
        instance = { fd: getLogFile() } 
      }
      return instance
    }
  }
})()

Single.getInstance().fd

工廠模式

以抽象類約束其實體類行為，用工廠類選擇要實例化的實體類，產(chǎn)出擁有相同功能的對象（在后端語言中返回類型是抽象類）
解決問題：主要解決接口選擇的問題，如日志記錄，可以使用本地日志或者日志實時上報，以后還可能有其它，但在記錄時不去關心日志的具體記錄實現(xiàn)

// 定義接口
var iLog = function () { this.msg = '' }
iLog.prototype = {
    logError: function() { return new Error('抽象方法不能調(diào)用'); },
    logWarn: function() { return new Error('抽象方法不能調(diào)用'); }
};

// 實現(xiàn)接口
var txtLog = function (msg) { this.type = 'txt'; this.msg = msg }
txtLog.prototype = new iLog()
txtLog.prototype.logError = function() { return console.info('loged in local txt', this.msg); }
txtLog.prototype.logWarn = function() { return console.info('loged in local txt', this.msg); }

var nwLog = function () { this.type = 'nw' }
nwLog.prototype = new iLog()
nwLog.prototype.logError = function() { return console.info('loged in network', this.msg); }
nwLog.prototype.logWarn = function() { return console.info('loged in network', this.msg); }

// factroy
var logFactroy = function (type, msg) {
  switch (type) {
    case 'txt': return new txtLog(msg);
    case 'net': return new nwLog(msg);
  }
}

var log007 = logFactroy('txt', 'error on P32')
log007 instanceof iLog
> true
log007.logError()
> loged in local txt error on P32

抽象工廠

圍繞一個超級工廠創(chuàng)建其他工廠。
解決問題：工廠模式的產(chǎn)品有多個，比如日志功能除了自動上報，還要有用戶提交反饋的功能

var iLog = function () { this.msg = '' }
iLog.prototype = {
    logError: function() { return new Error('抽象方法不能調(diào)用'); },
    logWarn: function() { return new Error('抽象方法不能調(diào)用'); }
};

var iFeedback = function () { this.msg = '' }
iFeedback.prototype = {
    logError: function() { return new Error('抽象方法不能調(diào)用'); },
    logWarn: function() { return new Error('抽象方法不能調(diào)用'); }
};

// 抽象工廠方法
var VehicleFatory = function(subType, superType) {
  switch (superType) {
    case 'log': subType.prototype = iLog()
    case 'feedback': subType.prototype = iFeedback()
  }
};

// 創(chuàng)建產(chǎn)品子類繼承相應的產(chǎn)品簇抽象類
var txtLog = function (msg) { this.type = 'txt'; this.msg = msg }
//抽象工廠實現(xiàn)對Car抽象類的繼承
VehicleFactory(txtLog, 'Log');
txtLog.prototype.logError = function() { return console.info('loged in local txt', this.msg); }
txtLog.prototype.logWarn = function() { return console.info('loged in local txt', this.msg); }

new txtLog('error on P32').logError()
> loged in local txt error on P32