裝飾模式:Decorator常被翻譯成"裝飾",我覺(jué)得翻譯成"油漆工"更形象點(diǎn),油漆工(decorator)是用來(lái)刷油漆的,那么被刷油漆的對(duì)象我們稱(chēng)decoratee.這兩種實(shí)體在Decorator模式中是必須的.

Decorator定義:
動(dòng)態(tài)給一個(gè)對(duì)象添加一些額外的職責(zé),就象在墻上刷油漆.使用Decorator模式相比用生成子類(lèi)方式達(dá)到功能的擴(kuò)充顯得更為靈活.

使用Decorator的理由是:這些功能需要由用戶(hù)動(dòng)態(tài)決定加入的方式和時(shí)機(jī).Decorator提供了"即插即用"的方法,在運(yùn)行期間決定何時(shí)增加何種功能.

[簡(jiǎn)易實(shí)例]

<script type="text/javascript">var f = function() {alert('原有函數(shù)');}var _f = f;f = function() {alert('執(zhí)行前置包裝函數(shù)');_f();alert('執(zhí)行后置包裝函數(shù)');}f(); </script>

[常用實(shí)例] ---- 多重onload綁定

<script type="text/javascript"> function addLoadEvent(fn) {var oldEvent = window.onload;if(typeof window.onload != 'function') {window.onload = fn;}else {window.onload = function() {oldEvent();fn();}} } function fn1() {alert('加載一'); } function fn2() {alert('加載二'); } function fn3() {alert('加載三'); } addLoadEvent(fn1); addLoadEvent(fn2); addLoadEvent(fn3); </script>

[擴(kuò)展實(shí)例]

<script type="text/javascript"> // 被刷油漆者 Decoratee = function() {alert('被刷油漆'); } // 刷油漆工 Decorator = {beginList: [], // 前置函數(shù)列表endList: [], // 后置函數(shù)列表append: function(fn) {this.endList.push(fn);},before: function(fn) {this.beginList.splice(0, 0, fn);},wrap: function(fn/* 要被修飾的函數(shù)體 */) {var $ = this, $1 = [], $2 = [];// 包裝前置函數(shù)for(var i = 0, len = $.beginList.length; i < len; i++) {$1[i] = $.beginList[i];}// 包裝后置函數(shù)for(var i = 0, len = $.endList.length; i < len; i++) {$2[i] = $.endList[i];}try {return function(){for(var i = 0, len = $1.length; i < len; i++) {$1[i]();}if(typeof fn == 'function') fn();for(var i = 0, len = $2.length; i < len; i++) {$2[i]();}}}finally {this.beginList.length = this.endList.length = 0;}} }Decorator.before(function() { alert('刷油漆前先釘木頭') }); Decorator.before(function() { alert('刷油漆前先釘釘子') }); Decorator.append(function() { alert('刷油漆后要晾干') }); Decorator.append(function() { alert('刷油漆后要涂鴉') }); Decorator.wrap(Decoratee)(); // 開(kāi)始刷油漆 </script>

轉(zhuǎn)載于:https://www.cnblogs.com/bluedream2009/archive/2010/01/31/1660673.html

總結(jié)

以上是生活随笔為你收集整理的javascript装饰者模式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。