JavaScript之裝飾者模式

2021-09-23 20:19:10 字數 1752 閱讀 1647

裝飾者模式用於為物件動態增加職責。

相較於裝飾者模式而言,繼承導致超類和子類之間的強耦合,超類修改,子類也會隨之改變,同時在功能需求增加時,可能會建立出大量的子類。裝飾者模式則更加靈活,即用即增。

對於需求的增加,我們經常做的處理是直接修改某個物件或某個函式,這很不好,違背了開放-封閉原則。以飛機大戰中的飛機物件為例,不同級別的飛機傳送不同的子彈,普通飛機傳送普通的子彈,二級飛機傳送飛彈,**飛機傳送原子彈,使用裝飾者模式處理:

const

plane

=function()

plane.prototype.

fire

=function()

// 二級飛機

const

missiledecorator

=function

(plane)

missiledecorator.prototype.

fire

=function()

// **飛機

const

atomdecorator

=function

(plane)

atomdecorator.prototype.

fire

=function()

let plane =

newplane()

plane =

newmissiledecorator

( plane )

plane =

newatomdecorator

( plane )

plane.

fire()

// 依次傳送三種型別的子彈

裝飾者模式的做法是保持原函式的引用,執行原函式,再拓展一部分功能。

直接對函式作處理:

const

fire

=function()

const _fire = fire

const

missilefire

=function()

const _missilefire = missilefire

const

atomfire

=function()

atomfire()

//

這樣處理,難以管理很多中間變數,且this指向有時候會丟失。

function.prototype.

before

=function

(beforefn)

}function.prototype.

after

=function

(afterfn)

}const

plane

=function()

function

fire()

function

missilefire()

function

atomfire()

const decoratorfire = fire.

after

( missilefire).

after

( atomfire

)decoratorfire()

// 也會依次列印三個字串

使用before,after函式可以保持this的傳遞,也避免了臨時變數的建立。

javaScript設計模式之裝飾者模式

裝飾者模式能夠在不改變物件自身的基礎上,在程式執行期間對物件動態的新增職責。與繼承相比,裝飾者是一種更加輕便靈活的做法,這是一種 即用即付 的方式。var plane function plane.prototype.fire function var missiledecorator functi...

四 JavaScript設計模式之建造者模式

一 建造者模式模式概念 建造者模式可以將乙個複雜的物件的構建與其表示相分離,使得同樣的構建過程可以建立不同的表示。也就是說如果我們用了建造者模式,那麼使用者就需要指定需要建造的型別就可以得到它們,而具體建造的過程和細節就不需要知道了。建造者模式實際就是乙個指揮者,乙個建造者,乙個使用指揮者呼叫具體建...

Java設計模式 裝飾者模

裝飾者模式,其實不難理解,簡單地說就是裝飾者和被裝飾者擁有共同的超類,裝飾者只是豐富了行為,拓展了功能,而型別是不變的。說起來可能比較抽象,接下來通過乙個簡單的例子來實現乙個裝飾者模式。動態的給乙個物件新增一些額外的職責或者功能,就增加功能來說,裝飾者模式相比生成子類更為靈活。大多數情況下被裝飾者不...