刚开始看这段代码有点绕,现在回过头来看,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. ios UINavigationController 导航栏

    添加全屏侧滑返回 .获取到系统的pop返回手势 .获取pop在哪个view上 .获取target,action .自定义UIPanGestureRecognizer //1.获取手势 guard le ...

  2. Bc-数组-Stack

    1.栈,堆栈,先进后出 2.栈的几个操作: > 入栈,push > 出栈,pop > 获取栈顶元素,peek > 获取栈中共有元素个数,getSize > 是否为空,is ...

  3. 之前项目使用的轻量的goweb框架

    技术栈 go 主开发语言 基于 gorilla 项目 javascript(nodejs) 部分小工具,josn对象转换,自动编译 C#,codesmith通用代码生成,生成最基本的crud和翻页. ...

  4. 基于Python的Flask基础知识

    Flask简介 Flask 是一个使用 Python 编写的轻量级 Web 应用程序框架.Armin Ronacher带领一个名为Pocco的国际Python爱好者团队开发了Flask. 下面我们简单 ...

  5. centos 中文乱码解决办法2

    特别注意:vm10自带虚拟机共享工具,自动识别utf-8格式的中文文件内容 下面步骤摘自网络: 两种方案其实差不多,这里提供两个文件的下载地址,免得去网上搜这两个文件了: fonts-chinese- ...

  6. MOOC(7)- case依赖、读取json配置文件进行多个接口请求-openpyxl读取excel(14)

    从excel中读取数据 # -*- coding: utf-8 -*- # @Time : 2020/2/12 17:23 # @File : do_excel_openpyxl_14.py # @A ...

  7. 《你不知道的Javascript》学习笔记

    简介 众所周知,JavaScript 既是一门充满吸引力.简单易用的语言,又是一门具有许多复杂微妙技术的语言,即使是经验丰富的JavaScript 开发者,如果没有认真学习的话也无法真正理解它们. 如 ...

  8. proxmox新版本使用了lxc容器,导致以前的vzlist命令无法使用,于是自己写了一个脚本来获取所有半虚拟化主机的信息状态

    #!/usr/bin/env python #encoding:utf-8 # desc:用来描述各个主机信息 import os #CTID NPROC STATUS IP_ADDR HOSTNAM ...

  9. 3dmax2020卸载/安装失败/如何彻底卸载清除干净3dmax2020注册表和文件的方法

    3dmax2020提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dmax2020失败提示3dmax2020安装未完成,某些产品无法安装,也有时候想重新安装3 ...

  10. python中的reduce函数

    python中的reduce   python中的reduce内建函数是一个二元操作函数,他用来将一个数据集合(链表,元组等)中的所有数据进行下列操作:用传给reduce中的函数 func()(必须是 ...