不可不知的JavaScript、 ES6、TypeScript 設計模式之單例模式

什麼是單例

單例模式是非常常用的一種設計模式，雖然你可能都不知道你在使用，單例模式中 對象類需要保證只有一個實例存在。單例就是保證一個類只有一個實例，實現的方法一般是先判斷實例存在與否，如果存在直接返回，如果不存在就創建了再返回，以確保了一個類只有一個實例對象。

舉個例子，就像每個人都只能有一個身份證,你沒有身份證可以辦理一個，但如果有了再想辦理多一個身份證，那麼對不起，不可能，這種情況就叫單例。

實現單例模式的方式有很多，比如使用對象字面量的方式是最常用的創建方式：

但這種方式並不能夠被實例化，僅能使用一次。並且所有的屬性和方法都暴漏在外面，很容易造成命名空間的汙染，所以說並不那麼的優雅。

那麼我們開始對上面的代碼進行一次優化，讓它只暴漏我們想暴漏的方法和屬性。

我們在上面的函數中創建了私有方法和變量，只暴漏了我們希望暴漏的變量和方法，是不是優雅了很多，但是讓我們再回顧一下單例模式的概念和實現方式：

單例就是保證一個類只有一個實例，實現的方法一般是先判斷實例存在與否，如果存在直接返回，如果不存在就創建了再返回，以確保了一個類只有一個實例對象。

顯然上面的代碼還不滿足單例模式的條件不是嗎？還記得身份證的例子嗎？我們再回顧一遍。

下面的代碼也是這樣的邏輯

因為我們只實例化了一次所以當你改變參數的時候因為沒有被實例化所以輸出的結果還是第一次實例化的時候的結果。這就是單例模式了。

有了ES6以後我們的代碼就可以寫的更加的優雅

首先我們創建了一個類，初始化的時候標記改類是否初始化過，然後使用static創建了一個靜態類，也就是說只能被類直接調用，實例化以後就不可以在調用getInstance方法。

然後你看到了 結果和上面的一樣都只會打印出第一次被實例化的參數。

vue3.0馬上就要來了，雖然他還可以使用es6來進行開發，但源碼卻是使用TypeScript進行編寫的，可見大神們是多麼的喜歡TypeScript，所以如果不下手可就晚了，那麼我們看下用TypeScript來實現單例模式如何編寫，和es6有多大的區別。

與JavaScript相比Typescript 的語法更加的嚴謹，更便於學習和理解。

在上的代碼中我們同樣創建了一個類，在進行變量聲明的是，TypeScript聲明瞭私有靜態變量同時限制了他的類型。其他寫法與es6相差不大。