快捷導(dǎo)航

JS 設(shè)計模式之：單例模式定義與實現(xiàn)方法淺析

更新時間：2020年05月06日 10:57:18 作者：savokiss

這篇文章主要介紹了JS 設(shè)計模式之：單例模式,結(jié)合實例形式分析了JS 單例模式原理、定義、實現(xiàn)方法與相關(guān)注意事項,需要的朋友可以參考下

概念

單例模式（Singleton）屬于創(chuàng)建型的設(shè)計模式，它限制我們只能創(chuàng)建單一對象或者某個類的單一實例。

通常情況下，使用該模式是為了控制整個應(yīng)用程序的狀態(tài)。在日常的開發(fā)中，我們遇到的單例模式可能有：Vuex 中的 Store，Vue 的根實例，任何導(dǎo)出單個對象的 ES6 模塊等。

字面量寫法

最簡單的單例其實就像下面這樣：

const cat = {
  name: 'mi',
  age: 4
}

了解 const 語法的小伙伴都知道，這只喵是不能被重新賦值的，但是它里面的屬性其實是可變的。

如果想要一個不可變的單例對象：

const cat = {
  name: 'mi',
  age: 4
}

Object.freeze(cat);

這樣就不能新增或修改這只喵上的任何屬性，它變成了 冰凍喵~

如果是在模塊中使用，上面的寫法并不會污染全局作用域，但是直接生成一個固定的對象缺少了一些靈活性。

常用寫法

相對而言，使用類或工廠方法來實現(xiàn)單例更加常用。假設(shè)我們有一個叫作 Logger 的類，它具有和 Console 相同的 API。

類單例

類的單例寫法非常常用，如果我們想要這么使用它：

const logger = new Logger();
logger.log('msg');

// 這里大概寫了 1000 行代碼

const logger2 = new Logger();
logger.log('new msg');

logger === logger2; // true

即盡管 new 了多次 Logger，它返回的都是同一個實例。

下面直接看最實用的實現(xiàn)方式：

class Logger {
  constructor () {
    if (!Logger._singleton) {
      Logger._singleton = this;
    }
    return Logger._singleton;
  }
  
  log (...args) {
    console.log(...args);
  }
}

export default Logger;

上面的方式將單例對象存儲在了構(gòu)造器上，這樣的話不管 new Logger 多少次，返回的都是同一個 Logger 實例了。

這里有一個細節(jié)需要注意，即 new 關(guān)鍵字后面的構(gòu)造函數(shù)如果顯式返回一個對象，new 表達式就會返回該對象。

具體可參見《你不知道的 JavaScript （上卷）》中的 new 綁定 相關(guān)章節(jié)。

工廠單例

如果不喜歡用 new 關(guān)鍵字，可以使用工廠方法返回單例對象。

let logger = null

class Logger {
  log (...args) {
    console.log(...args);
  }
}

function createLogger() {
  if (!logger) {
    logger = new Logger();
  }
  return logger;
}

export default createLogger;

上面的代碼相當于在模塊內(nèi)部緩存了 logger 實例，然后導(dǎo)出了一個工廠方法。這種寫法在模塊化代碼中比較常見，工廠方法也可以接收參數(shù)用來初始化單例對象。

今天的內(nèi)容比較好理解，其中的單例寫法也是筆者常用的方法。

下一篇我們再具體講講工廠模式的應(yīng)用~