Javascript是一種廣泛使用的編程語言,在實際開發中,它經常遇到大量的代碼重復和邏輯復雜的場景,這種情況下,我們就需要用到設計模式來幫助我們協調整個代碼結構,并且提高代碼的可讀性和可重用性。在javascript中常用的設計模式有以下幾種:
單例模式
在javascript中,單例模式是一種非常常見的設計模式,它的作用是確保一個類有且僅有一個實例,并且提供了對該實例的全局訪問。
var Singleton = (() => { var instance; function init() { // ...code here... return { // ...code here... }; } return { getInstance: function () { if (!instance) { instance = init(); } return instance; } }; })();
上述代碼中,我們通過閉包創建了一個Singleton對象,并在其內部實現了一個init()函數,用來進行對象的實例化;getInstance()函數是一個公共接口,用來控制對該實例的全局訪問。
觀察者模式
觀察者模式是一種常見的設計模式,它定義了對象之間一對多的依賴關系,這樣當一個對象狀態發生改變時,其他依賴于它的對象就會收到通知并且自動更新。
function Subject() { this.observers = []; } Subject.prototype = { addObserver: function(observer) { this.observers.push(observer); }, removeObserver: function(observer) { var index = this.observers.indexOf(observer); if (index != -1) { this.observers.splice(index, 1); } }, notify: function() { for (var i = 0; i < this.observers.length; i++) { this.observers[i].update(); } } }; function Observer() { this.update = function() { // ...code here... } }
上面的代碼中,我們定義了一個Subject類和一個Observer類,Subject用來維護觀察者列表并在對象狀態發生改變時通知每個觀察者,Observer則用來表示觀察者對象,并實現了update方法,該方法會在被通知時被自動調用。
裝飾者模式
裝飾者模式用來動態地給一個對象添加一些額外的職責,而不需要改變其原始對象的功能實現。在javascript中,我們經常用裝飾者模式來擴展對象的功能。
function Coffee() { this.cost = function() { return 10; }; } function Milk(coffee) { this.cost = function() { return coffee.cost() + 2; }; } function Sugar(coffee) { this.cost = function() { return coffee.cost() + 1; }; } var coffee = new Coffee(); coffee = new Milk(coffee); coffee = new Sugar(coffee);
上面的例子中,我們定義了三個類,Coffee類定義了一個基礎的咖啡,Milk和Sugar類則用來擴展該咖啡的功能,同時它們都接收一個Coffee對象作為參數,并動態地給該咖啡對象增加一些額外的職責。
命令模式
在javascript中,命令模式用來將一個請求封裝成一個對象,從而使得可以方便、靈活地在不同的地方調用這些請求并撤回(undo)它們。
var Command = function (execute, undo, value) { this.execute = execute; this.undo = undo; this.value = value; }; var commands = { 'CMD_ONE': new Command(CMD_ONE.execute, CMD_ONE.undo, value), 'CMD_TWO': new Command(CMD_TWO.execute, CMD_TWO.undo, value) };
上面的例子中,Command類用來包裝一個請求,方便做撤銷操作。commands則是一個對象字面量,用來維護所有可用的命令。
適配器模式
適配器模式用來解決兩個接口之間不同兼容性問題,其中一個接口是客戶代碼使用的(目標接口),另一個接口是客戶期望的(適配者接口)。
function Adaptee() { this.request = function() { // ...code here... }; } function Target() { this.makeRequest = function() { var adaptee = new Adaptee(); adaptee.request(); }; }
上面的代碼中,Adaptee類是客戶代碼所期望的接口,而Target類是客戶實際調用并被適配的接口,適配器需要將Adaptee的request方法適配成Target所期望的makeRequest方法。
總結
上述介紹的幾個javascript中的設計模式只是其中的一部分,它們具有不同的應用場景和開發目的,可以根據實際情況來選擇使用。設計模式可以幫助我們有效地處理代碼結構,提高代碼的可讀性和可維護性,對于程序員而言極為有益。