前言

設計模式是一種理念，官方對它的定義是這樣的：在面向對象軟件設計過程中針對特定問題的簡潔而優雅的解決方案。

因此設計模式不針對某種特定的語言，在C++，Java中都有不同設計模式的實現，同樣在Javascript中也有其對應的實現，今天我們就一起來看看Javascript中是如何實現的。

Javascript設計模式

單例模式

單例模式，顧名思義就是保證每個類都只有一個實例對象。

其實現思路很簡單，先判斷實例是否存在，如果不存在則創建新的實例返回，如果存在則直接返回該實例。

在下面的代碼中，我們藉助代理來具體實現。

單例模式

策略模式

策略模式可以理解為：封裝多個可以相互替換的算法，獨立於具體的對象，即對象和行為分離的原則。

一個具體的策略模式實現需要兩個部分，一個是所有可能的策略對象，另一個是具體的執行環境，在執行環境中判斷客戶的要求委託給哪個策略執行。

具體的代碼實現如下所示。

策略模式

代理模式

代理模式可以理解為：為其他對象提供一種代理以控制對這個對象的訪問。

在某些情況下，某個對象不適合被直接訪問到，則可以通過代理對象作為客戶端和目標對象之間的中介。

代理模式在前端有一個很好的使用場景-圖片懶加載。在真正的圖片還沒有下載時，先通過一張loading圖來顯示，然後等到具體的圖片下載完成之後再修改img的src屬性。

以下是一個通過代理模式完成圖片懶加載的方法。

代理模式

裝飾者模式

裝飾者模式可以理解為：動態的將職責附加到對象上，而且不會改變對象本身的行為。

我們可以舉一個'齊天大聖'的例子，例如齊天大上本身是一隻猴子，可以看做是被裝飾者；而一旦它具有七十二變的本領時，可以變化為其他七十二種角色，這就是裝飾器所做的事情。

一般裝飾器會在被裝飾者之前或者之後加上自己的行為以達到特定的目的，例如Spring框架中的AOP模式。

接下來，我們通過一段代碼看下裝飾模式的Javascript實現。

先定義一個before和after的行為。

before和after行為

然後設置幾個具體的表現形式，通過裝飾器調用。

裝飾器調用

以上就是一個完整使用裝飾器模式的Javascript實現例子。

結束語

今天這篇文章簡單的介紹了下Javascript中的幾種常見的設計模式，當然不只有這幾種，後續我們會繼續探討其他設計模式的Javascript實現。