ES6 - 装饰器 - Decorater
|
|
注意,修饰器对类的行为的改变,是代码编译时发生的,而不是在运行时。这意味着,修饰器能在编译阶段运行代码。也就是说,修饰器本质就是编译时执行的函数。
|
|
|
修饰器是一个对类进行处理的函数。修饰器函数的第一个参数,就是所要修饰的目标类
|
|
|
如果想添加实例属性,可以通过目标类的prototype对象操作。
|
|
把Foo类的方法添加到了MyClass的实例上面
|
可以用Object.assign()模拟这个功能。
|
|
方法的修饰
|
修饰器函数一共可以接受三个参数,第一个参数是所要修饰的目标对象,即类的实例(这不同于类的修饰,那种情况时target参数指的是类本身);第二个参数是所要修饰的属性名,第三个参数是该属性的描述对象。
|
|
方法修饰的作用
|
修改属性描述对象的enumerable属性,使得该属性不可遍历
@log修饰器,可以起到输出日志的作用
修饰器有注释的作用
|
|
不能应用于 函数
|
因为函数存在提升
|
|
core-decorator.js
|
autobind修饰器使得方法中的this对象,绑定原始对象
readonly修饰器使得属性或方法不可写。
override修饰器检查子类的方法,是否正确覆盖了父类的同名方法,如果不正确会报错
deprecate或deprecated修饰器在控制台显示一条警告,表示该方法将废除
suppressWarnings修饰器抑制deprecated修饰器导致的console.warn()调用。但是,异步代码发出的调用除外
|
|
使用修饰器实现自动发布事件
|
import publish from "path/to/decorators/publish";
class FooComponent {
@publish("foo.some.message", "component")
someMethod() {
return {
my: "data"
};
}
@publish("foo.some.other")
anotherMethod() {
// ...
}}
以后,只要调用someMethod或者anotherMethod,就会自动发出一个事件
|
|
Mixin
|
混入
|
|
Trait
|
Trait 也是一种修饰器,效果与 Mixin 类似,但是提供更多功能,比如防止同名方法的冲突、排除混入某些方法、为混入的方法起别名等等
|
|
Babel转码器
|
已经支持 Decorator
目前,Babel 转码器已经支持 Decorator。
首先,安装babel-core和babel-plugin-transform-decorators。由于后者包括在babel-preset-stage-0之中,所以改为安装babel-preset-stage-0亦可。
$ npm install babel-core babel-plugin-transform-decorators
然后,设置配置文件.babelrc。
{"plugins": ["transform-decorators"]}
这时,Babel 就可以对 Decorator 转码了。
脚本中打开的命令如下。
babel.transform("code", {plugins: ["transform-decorators"]})
Babel 的官方网站提供一个在线转码器,只要勾选 Experimental,就能支持 Decorator 的在线转码。
|
ES6 - 装饰器 - Decorater的更多相关文章
- ES6装饰器Decorator基本用法
1. 基本形式 @decorator class A {} // 等同于 class A {} A = decorator(A); 装饰器在javascript中仅仅可以修饰类和属性,不能修饰函数.装 ...
- es6 装饰器decorator的使用 +webpack4.0配置
decorator 装饰器 许多面向对象都有decorator(装饰器)函数,比如python中也可以用decorator函数来强化代码,decorator相当于一个高阶函数,接收一个函数,返回一个被 ...
- 从ES6重新认识JavaScript设计模式: 装饰器模式
1 什么是装饰器模式 向一个现有的对象添加新的功能,同时又不改变其结构的设计模式被称为装饰器模式(Decorator Pattern),它是作为现有的类的一个包装(Wrapper). 可以将装饰器理解 ...
- ES6 系列之我们来聊聊装饰器
Decorator 装饰器主要用于: 装饰类 装饰方法或属性 装饰类 @annotation class MyClass { } function annotation(target) { targe ...
- ES6学习之装饰器
定义:修饰器是一个对类进行处理的函数,用来修改类的行为 <注>:装饰器只能用来修改类及类的方法 类的装饰: 静态属性:只能通过类访问,修饰函数直接在类上操作 @testable class ...
- Python基础篇【第6篇】: Python装饰器
装饰器 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创建了一个装饰类, ...
- 基于TypeScript装饰器定义Express RESTful 服务
前言 本文主要讲解如何使用TypeScript装饰器定义Express路由.文中出现的代码经过简化不能直接运行,完整代码的请戳:https://github.com/WinfredWang/expre ...
- TypeScript装饰器(decorators)
装饰器是一种特殊类型的声明,它能够被附加到类声明,方法, 访问符,属性或参数上,可以修改类的行为. 装饰器使用 @expression这种形式,expression求值后必须为一个函数,它会在运行时被 ...
- JS 装饰器解析
随着 ES6 和 TypeScript 中类的引入,在某些场景需要在不改变原有类和类属性的基础上扩展些功能,这也是装饰器出现的原因. 装饰器简介 作为一种可以动态增删功能模块的模式(比如 redux ...
随机推荐
- Day9 - G - Doing Homework HDU - 1074
有n个任务,每个任务有一个截止时间,超过截止时间一天,要扣一个分.求如何安排任务,使得扣的分数最少.Input有多组测试数据.第一行一个整数表示测试数据的组数第一行一个整数n(1<=n<= ...
- tcp/ip协议学习笔记一
一. 简述 以前在学校学习计算机网络的时候学习多是网络7层模型OSI,了解了一些基本的计算机网络概念和协议通信格式,但是一直没弄明白其中的原理,包括各层之间的关系,应用,还有一些常见的令牌环网到底是什 ...
- Python 开篇
一.Linux基础 - 计算机以及日后我们开发的程序防止的服务器的简单操作 二.Python开发 http://www.cnblogs.com/wupeiqi/articles/5433893.htm ...
- 配置antMatchers(HttpMethod.GET,"/**").permitAll()当时仍然会校验
.antMatchers(HttpMethod.GET,"/**").permitAll() .anyRequest().authenticated() .and() .addFi ...
- Samjia 和矩阵[loj6173](Hash+后缀数组)
传送门 本题要求本质不同的子矩阵,即位置不同也算相同(具体理解可以看样例自己yy). 我们先看自己会什么,我们会求一个字符串中不同的子串的个数.我们考虑把子矩阵变成一个字符串. 先枚举矩阵的宽度,记为 ...
- 题解 zr1212 【20WC集训】货币
题目链接 我们给每个连通块图上一种颜色.不同的连通块涂不同的颜色. 首先,我们定义\(f_r\)表示:使\([l,r]\)包括\([1,r]\)里所有颜色的最大的\(l\). 然后我维护一个变量\(p ...
- SpringData JPA使用JPQL的方式查询和使用SQL语句查询
使用Spring Data JPA提供的查询方法已经可以解决大部分的应用场景,但是对于某些业务来说,我们还需要灵活的构造查询条件, 这时就可以使用@Query注解,结合JPQL的语句方式完成查询 持久 ...
- Docker 简单使用笔记
Docker笔记 安装 首先检查是否已经安装过Docker:yum list installed | grep docker,如果已经安装过需要删除旧的Docker:yum remove dock ...
- day04-Python运维开发基础(位运算、代码块、流程控制)
# (7)位运算符: & | ^ << >> ~ var1 = 19 var2 = 15 # & 按位与 res = var1 & var2 " ...
- Day7 - A - Visible Lattice Points POJ - 3090
A lattice point (x, y) in the first quadrant (x and y are integers greater than or equal to 0), othe ...