装饰模式 -- 原先没有,后期添加的属性和方法

修饰器(Decorator)是一个函数,用来修饰类的行为。这是ES7的一个提案,目前Babel转码器已经支持。

需要先安装一个插件:

npm install babel-plugin-transform-decorators-legacy --save-dev

然后在项目根目录下,找到:.babelrc => 修改为

"plugins": ["transform-runtime","transform-decorators-legacy"],

// 添加属性,添加方法,在方法执行之前添加动作

1.给添加一个静态方法(属性)

function chooseCourse(target){   // 定义一个方法
  target.course = '物理';
} function setStudy(target){
  target.study = function(){
    console.log("学习" + target.course);
  }
} @chooseCourse // 通过@ + 函数名,表示 用函数 chooseCourse 来修饰 类 Student,这样就给student添加了一个course,值为'物理'
@classroom // 因为修饰的是类,所以相当于添加了静态属性和静态方法
class Student{}; // 定义一个类
Student.study();

2.修饰器带参数

function chooseCourse(courseName){
  return function(target){ // 闭包 返回一个闭包函数
    target.courseName = courseName;
  }
} function classroom(roomName){
  return function(target){
    target.study = function(){
      console.log('在' + roomName + '学习' + target.courseName);
    }
  }
} @chooseCourse('物理') // 传参 通过添加参数的方式,来添加属性和方法
@classroom('第1教室') // 传参
class Student{}
Student.study();

3.修饰器不仅可以修饰类,还可以修饰类的方法(属性)

function chooseCourse(courseName){
  return function(target){
    console.log('检查准考证' + target.uid); // target中的this发生指针转移
    target.courseName = courseName;
  }
} class Student{
  constructor(){
    this.uid = 15;
  }
  @chooseCourse('物理') // 对类里面的属性和方法直接进行修饰 , 此处的@chooseCourse 表示 修饰 exam()方法 // 代码运行到此行才进行修饰
  exam(){ // 定义一个方法
    console.log(this.uid + '考试,考:' + this.courseName);
  }
} // 后面不能加 ';' let student = new Student(); // 用new方法创建一个 类的实例 new 一个 student,将student作为target传递到方法中
student.exam();

4.修饰器只能用于类和类的方法,不能用于函数,会导致函数提升而发生错误

//-------------错误---------------

@chooseCourse('物理')

function Teacher(){
  teach(){
    console.log('讲师教:' + this.courseName);
  }
} Teacher.teach();

5.装饰模式与代理模式的差别

装饰器模式(从外边注入属性和方法)关注于在一个对象上动态的添加方法,然而代理模式(proxy 屏蔽了原有的类,对代理进行操作,实现方法重新)关注于控制对对象的访问。换句话说,用代理模式,代理类(proxy class)可以对它的客户隐藏一个对象的具体信息。因此,当使用代理模式的时候,我们常常在一个代理类中创建一个对象的实例,并且,当我们使用装饰器模式的时候,我们通常的做法是将原始对象作为一个参数传给装饰者的构造器。

使用代理模式,代理和真实对象之间的关系通常在编译时就已经确定了,而装饰者能够在运行时递归地被构造。

Decorator [ˈdekəreɪtə(r)] 修饰器/装饰器 -- 装饰模式的更多相关文章

  1. Python - 三大器 迭代器,生层器,装饰器

    目录 Python - 三大器 迭代器,生层器,装饰器 一. 容器 二. 可迭代对象(iterable) 三. 迭代器 四. 生成器 五. 装饰器 1. 定义 六. 闭包 Python - 三大器 迭 ...

  2. python 带参与不带参装饰器的使用与流程分析/什么是装饰器/装饰器使用注意事项

    一.什么是装饰器 装饰器是用来给函数动态的添加功能的一种技术,属于一种语法糖.通俗一点讲就是:在不会影响原有函数的功能基础上,在原有函数的执行过程中额外的添加上另外一段处理逻辑 二.装饰器功能实现的技 ...

  3. typescript装饰器 方法装饰器 方法参数装饰器 装饰器的执行顺序

    /* 装饰器:装饰器是一种特殊类型的声明,它能够被附加到类声明,方法,属性或参数上,可以修改类的行为. 通俗的讲装饰器就是一个方法,可以注入到类.方法.属性参数上来扩展类.属性.方法.参数的功能. 常 ...

  4. typescript装饰器定义 类装饰器 属性装饰器 装饰器工厂

    /* 装饰器:装饰器是一种特殊类型的声明,它能够被附加到类声明,方法,属性或参数上,可以修改类的行为. 通俗的讲装饰器就是一个方法,可以注入到类.方法.属性参数上来扩展类.属性.方法.参数的功能. 常 ...

  5. Python_@修饰器(装饰器)的理解

    装饰器本质上是一个Python函数,它可以让其他函数在不需要做任何代码变动的前提下增加额外功能. 装饰器的作用就是为已经存在的对象添加额外的功能. def funA(fun): print (fun( ...

  6. python__高级 : @修饰器(装饰器)的理解

    以下是第一次了解的时候写的东西,有的地方理解不正确,虽已改正但是太片面,请直接看下面第二次修改加上的内容. ---------------------------------------------- ...

  7. python 函数及变量作用域及装饰器decorator @详解

    一.函数及变量的作用   在python程序中,函数都会创建一个新的作用域,又称为命名空间,当函数遇到变量时,Python就会到该函数的命名空间来寻找变量,因为Python一切都是对象,而在命名空间中 ...

  8. python 装饰器(decorator)

    装饰器(decorator) 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 装饰器(decorator)是一种高级Python语 ...

  9. 就谈个py 的装饰器 decorator

    很早很早就知道有这么个 装饰器的东西,叫的非常神秘. 包括c#  和 java 中都有这个东西, c#中叫做attribut 特性,java中叫做Annotation 注解,在偷偷学习c#教程的时候, ...

随机推荐

  1. luoguP3255 [JLOI2013]地形生成 动态规划

    出题人语文真好... 各不相同的标号和高度 = 各不相同的标号 + 单独的高度... 第一问比较简单,考虑从大到小插入,在相同情况下,按关键值从小到大插入 这样子,关键大的元素一定会影响到关键小的元素 ...

  2. 最封闭的开源系统,话说Android的八宗罪

    最封闭的开源系统,话说Android的八宗罪 http://www.ifanr.com/9833 Android 分裂的多面性 http://tech.cncms.com/shouji/android ...

  3. python开发_搜索本地文件信息写入文件

    功能:#在指定的盘符,如D盘,搜索出与用户给定后缀名(如:jpg,png)相关的文件 #然后把搜索出来的信息(相关文件的绝对路径),存放到用户指定的 #文件(如果文件不存在,则建立相应的文件)中 之前 ...

  4. Codeforces Round #245 (Div. 2) C. Xor-tree DFS

    C. Xor-tree Time Limit: 1 Sec  Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/430/problem/C ...

  5. Struts2 include(包含)多个配置文件

    Struts 2自带有“包含文件”功能,包含多个Struts配置文件合并为一个单元. 单个Struts配置文件 让我们来看看一个糟糕的 Struts 2 配置示例. struts.xml <?x ...

  6. SQLSERVER里面RR隔离级别没有GAP锁

    http://www.cnblogs.com/MYSQLZOUQI/articles/3862721.html

  7. js 实现纯前端将数据导出excel

    通过将json遍历进行字符串拼接,将字符串输出到csv文件,输出的文件不会再是html类型的文件而是真正的csv文件,代码如下 <html> <head> <p styl ...

  8. 使用 HAProxy, PHP, Redis 和 MySQL 轻松构建每周上亿请求Web站点

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  9. Go:Hello World!

    备注 结束了一周紧张的工作,周末像品茶一样玩味一下Go,本文主要记录学习Go的经历. Go是什么? 官方网站:http://golang.org/. 在Windows下安装Go 官方教程:http:/ ...

  10. android基础学习-Fragment和eclipse快捷键

    使用Fragment的原因 1. Activity间的切换不流畅 2. 模块化Activity,方便做局部动画(有时为了到达这一点要把多个布局放到一个activity里面,现在可以用多Fragment ...