javascript設計模式 之 10 職責鏈模式

2021-09-11 12:35:04 字數 2383 閱讀 7051

使多個物件都有機會處理請求,從而避免請求的傳送者和接收者的耦合關係。將這些物件連在一條鏈上,並沿這條鏈傳遞該請求,直到有乙個物件處理它為止。我們把這些物件稱為鏈中的節點。

我們希望實現乙個流程,商場預定手機:

var order = function(ordertype, pay, stock ) else

if ( ordertype === 2 && pay === true) else

if ( ordertype === 3 || pay === false) else }};

order( 1, true, 500); // 輸出: 500 元定金預購, 得到 100 優惠券

複製**

// 500預定

var order500 = function(ordertype, pay, stock) else

}// 200預定

var order200 = function(ordertype, pay, stock) else

}// 普通購買

var ordernormal = function(ordertype, pay, stock) else

}// 定義作用域鏈

var chain = function(fn)

chain.prototype.setnextsuccessor = function(fn) ;

chain.prototype.passrequest = function()

return ret;

}複製**

作用域鏈已經建立好了,下面就開始來呼叫:

var chain500 = new chain(order500);

var chain200 = new chain(order200);

var chainnormal = new chain(ordernormal);

chain500.setnextsuccessor(chain200).setnextsuccessor(chainnormal);

chain500.passrequest(3, false, 20);

複製**

通過改進,我們可以自由靈活地增加、移除和修改鏈中的節點順序,假如某天**運營人員又想出了支援 300 元定金購買,那我們就在該鏈中增加乙個節點即可.

var order200 = function(ordertype, pay, stock)  else 

}var chan300 = new chian(order300);

chain500.setnextsuccessor(chan300);

chan300.setnextsuccessor(chain200);

複製**

在高階函式部分我們使用了aop.我們改寫函式的function.prototype.after函式,使其前乙個函式返回nextsuccessor時,我們繼續將請求傳遞給下乙個函式。

function.prototype.after = function(fn) 

return ret;

}}order500.after(order200).after(ordernormal)(2, true, 20);

複製**

var ieupload = function()  catch(e) 

}var flashupload = function()

return

false;

}var getformupload = function()

function.prototype.after = function(fn)

return ret;

}}// 使用職責鏈呼叫

console.log(ieupload.after(flashupload).after(flashupload)());

複製**

職責鏈運用好了,可以幫助我們很好管理**,降低發起請求的物件和處理物件之間的耦合性。職責鏈中的節點數量和順序是自由變化的。無論在作用域鏈還是原型鏈,還是dom節點的冒泡事件,都能夠看到職責鏈的影子。

我覺得使用策略模式顯得更簡潔。

function

buy(stock) else

}var stratege= ,

5: function ()

};// context 類

function

order(type, pay, stock) else

}order(1, true, 100)

複製**

JavaScript設計模式之工廠模式

工廠模式是用來建立物件的一種最常用的設計模式。把建立物件的具體邏輯封裝在乙個函式中,那麼這個函式就可以被視為乙個工廠。工廠模式根據抽象程度的不同可以分為 簡單工廠,工廠方法和抽象工廠。簡單工廠模式又叫靜態工廠模式,由乙個工廠物件決定建立某一種產品物件類的例項。主要用來建立同一類物件的不同例項。fun...

JavaScript 設計模式之工廠模式

工廠模式的定義 工廠模式定義乙個用於建立物件的介面,這個介面由子類決定例項化哪乙個類。該模式使乙個類的例項化延遲到了子類。而子類可以重寫介面方法以便建立的時候指定自己的物件型別。工廠模式的使用場景 以下幾種情景下工廠模式特別有用 1 物件的構建十分複雜 2 需要依賴具體環境建立不同例項 3 處理大量...

JavaScript 設計模式之工廠模式

一 模式概念解讀 1.工廠模式概念文字解讀 工廠模式定義乙個用於建立物件的介面,這個介面由子類決定例項化哪乙個類。該模式使乙個類的例項化延遲到了子類。而子類可以重寫介面方法以便建立的時候指定自己的物件型別 抽象工廠 這個模式十分有用,尤其是建立物件的流程賦值的時候,比如依賴於很多設定檔案等。並且,會...