刚开始看这段代码有点绕,现在回过头来看,so easy!

Function.prototype.before = function(beforefn){
var _self = this;
return function(){
beforefn.apply(this,arguments); //this指向beforefn
return _self.apply(this,arguments);
}
} Function.prototype.after = function(afterfn){
var _self = this;
return function(){
var ret = _self.apply(this,arguments);
afterfn.apply(this,arguments);//this指向afterfn
return ret;
}
}

对于上面的代码我不想多说,都很简单,但是将before和after定义在原型上面,有点污染原型的意思,所以再次进行变通:

var before = function(fn,beforefn){
return function(){
beforefn.apply(this,arguments);
return fn.apply(this,arguments);
}
}
var a = before(function(){console.log(1)},function(){console.log(2)});
a = before(a,function(){console.log(3)})
a()
//3 2 1

before函数传入两个函数,一个是原来函数,另外是要提前执行的函数,方法体内部先执行beforefn,后执行原函数,this指向不被劫持,仍然保持各自函数的this环境。

其实这是AOP(Aspect Oriented Programming)"面向切面编程"的一种思想,对业务逻辑的各个部门进行隔离,从而使得业务逻辑各部分之间耦合度降低,提高程序的可重用性。

AOP说白了就是在不修改源代码的情况下给程序动态统一添加功能的一种技术,javascript的装饰者模式就是AOP编程的一种编程思想体现。

装饰者模式的应用场景很多:比如,分离业务代码,数据统计,还可以动态改变函数参数,插件式的表单验证等。

可以看出装饰者模式的特点:

1,在不改变原对象的代码结构下进行功能的添加;

2,装饰对象和原对象具有相同的接口,也就是说,可以以原对象的相同使用方式来使用装饰对象。

3,装饰对象中包含原对象的引用,就是说装饰对象是原对象经过包装后的对象

【完】

javascript的装饰者模式Decorator的更多相关文章

  1. 浅谈设计模式--装饰者模式(Decorator Pattern)

    挖了设计模式这个坑,得继续填上.继续设计模式之路.这次讨论的模式,是 装饰者模式(Decorator Pattern) 装饰者模式,有时也叫包装者(Wrapper),主要用于静态或动态地为一个特定的对 ...

  2. 【PHP设计模式 09_ZhuangShiQi.php】装饰器模式 (decorator)

    <?php /** * [装饰器模式 (decorator)] * 有时候发布一篇文章需要经过很多人手,层层处理 */ header("Content-type: text/html; ...

  3. 设计模式(八)装饰器模式Decorator(结构型)

    设计模式(八)装饰器模式Decorator(结构型) 1. 概述 若你从事过面向对象开发,实现给一个类或对象增加行为,使用继承机制,这是所有面向对象语言的一个基本特性.如果已经存在的一个类缺少某些方法 ...

  4. 设计模式 - 装饰者模式(Decorator Pattern) Java的IO类 用法

    装饰者模式(Decorator Pattern) Java的IO类 用法 本文地址: http://blog.csdn.net/caroline_wendy/article/details/26716 ...

  5. 设计模式 - 装饰者模式(Decorator Pattern) 具体解释

    装饰者模式(Decorator Pattern) 具体解释 本文地址: http://blog.csdn.net/caroline_wendy/article/details/26707033 装饰者 ...

  6. 装饰器模式-Decorator(Java实现)

    装饰器模式-Decorator(Java实现) 装饰器模式允许向一个现有的对象添加新的功能, 同时又不改变其结构. 其中 "现有对象"在本文中是StringDisplay类. 添加 ...

  7. 装饰者模式 Decorator

    项目:咖啡计费系统 背景:现有系统中有一个抽象类Beverage,有2个抽象方法GetDescription和Cost. namespace DecoratorPattern { /// <su ...

  8. 设计模式学习--装饰者模式(Decorator Pattern)

    概念: 装饰者模式(Decorator Pattern): 动态地将功能添加到对象,相比生成子类更灵活,更富有弹性. 解决方案: 装饰者模式的重点是对象的类型,装饰者对象必须有着相同的接口,也也就是有 ...

  9. 大话设计模式--装饰者模式 Decorator -- C++实现实例

    1.装饰者模式 Decorator 动态地给一个对象添加一个额外的职责, 就添加功能来说, 装饰模式比生成子类更为灵活. 每个装饰对象的实现和如何使用这个对象分离,  每个装饰对象只关心自己的功能,不 ...

随机推荐

  1. QQ消息群发助手(超级简单)

    大家好!我开发的小工具,效果见动图: 下载地址 QQ群发助手.rar 代码: def Login(): global Flag try: bot.Login(['-q',v1.get()]) tkin ...

  2. Office 365管理员设置

    一.注册 1.输入网站 http://www.21vbluecloud.com/  ,进入世纪互联蓝云官方网站 2.选择 运营的产品->Office 365 3.选择了解更多 4.浏览根据不同的 ...

  3. 动态添加checkbox

    <!--动态添加 checkbox--> <script type="text/javascript"> var data = new Array(); & ...

  4. asp.net 管道处理模式

  5. left join on和where 限制查询的区别在于

    left join on: 会显示前表的所有数据,不满足显示为null或者为0 . 而where显示的为满足条件的记录,不满足但是存在的数据不显示. 做统计数据的时候,用join on比较合理.

  6. generate的使用verilog

    根据项目设计的需要,要实例化多个类似的模块,这些类似的模块包括方波波形发生器,这几个模块基本相同,除了参数传递值不同,其他他部分都是相同的 具体实现代码如下: 此外有计数模块的例化,这个模块例化多个的 ...

  7. whatsoever|

    ADV (用于名词词组后,强调否定陈述)丝毫,任何,无论什么You use whatsoever after a noun group in order to emphasize a negative ...

  8. optogenetics|

    Bird &optogenetics&day&night 光遗传学(optogenetics)——结合遗传工程与光来操作个别神经细胞的活性,发现脑部如何产生γ波(gamma o ...

  9. 关于后端下载后端返回的blob类型文件的下载

    关于后端返回blob类型的文件下载记录,在请求的时候前端设置响应类型 responseType: 'blob', const blob = new Blob([r], {type: r.type}); ...

  10. mudbox卸载/完美解决安装失败/如何彻底卸载清除干净mudbox各种残留注册表和文件的方法

    在卸载mudbox重装mudbox时发现安装失败,提示是已安装mudbox或安装失败.这是因为上一次卸载mudbox没有清理干净,系统会误认为已经安装mudbox了.有的同学是新装的系统也会出现mud ...