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

修饰器(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. hdu 4790 Just Random

    思路:对于a<=x<=b,c<=y<=d,满足条件的结果为ans=f(b,d)-f(b,c-1)-f(a-1,d)+f(a-1,c-1). 而函数f(a,b)是计算0<= ...

  2. 初学Hadoop:利用VMWare+CentOS7搭建Hadoop集群

     一.前言 开始学习数据处理相关的知识了,第一步是搭建一个Hadoop集群.搭建一个分布式集群需要多台电脑,在此我选择采用VMWare+CentOS7搭建一个三台虚拟机组成的Hadoop集群. 注:1 ...

  3. bzoj 1086 树分块

    将树分成一些块,做法见vfleaking博客. /************************************************************** Problem: 108 ...

  4. JDK源码(1.7) -- java.util.Deque<E>

    java.util.Deque<E> 源码分析(JDK1.7) -------------------------------------------------------------- ...

  5. 数组中找出最小的K个数

    题目 给出一个数组,找出K个最小的值 例如给出数组{5,2,4,3,1},给定K值3,则输出结果为{2,3,1} 程序 先给出第一个版本的程序 public static void printKNum ...

  6. linux命令: Netstat

    在Internet RFC标准中,Netstat的定义是: Netstat是在内核中访问网络及相关信息的程序,它能提供TCP连接,TCP和UDP监听,进程内存管理的相关报告.    Netstat是控 ...

  7. React-如何在jsx中自动补全标签(vscode)

    痛点:  React库最近的增长趋势很明显, 很多朋友都在选择学习, 很多公司也在选择使用React栈. 但在使用React库写代码的时候, 有一个很让人苦恼的问题, 就是标签在jsx语法中不能自动补 ...

  8. ES6 Javascript 实用开发技巧

    ES6 实用开发技巧 定义变量/常量 ES6 中新增加了 let 和 const 两个命令,let 用于定义变量,const 用于定义常量 两个命令与原有的 var 命令所不同的地方在于,let, c ...

  9. <摘录>CentOS怎么查看某个命令的源代码

    安装yumdownloader工具: # yum install yum-utils 设置源: [base-src] name=CentOS-5.4 - Base src - baseurl=http ...

  10. X86调用约定 calling convention

    http://zh.wikipedia.org/wiki/X86%E8%B0%83%E7%94%A8%E7%BA%A6%E5%AE%9A 这里描述了在x86芯片架构上的调用约定(calling con ...