ECMAScript6:官方最新Decorator修饰器构造函数重写了。。。
改变
- babel发布了最新版本,npm最新版本的模块名称都改成@babel前缀,具体可前往babel英文官网查看,中文网站文档尚未更新
- 插件 plugin包都已更换名称,以官网为准,不然会报错
Decorator 构造函数完全更改,一脸懵逼:),原先target ,name, descriptor3个参数改为一个对象参数,参数字段具体如下图
具体查看 介绍https://tc39.github.io/propos...
新的写法
根据最新的api我写了小demo如下:
function decoratorclass (target) { if (target.kind !== 'class') { return } for (const element of target.elements) { if (element.kind !== 'method') { continue } const descriptor = element.descriptor const oldMethod = descriptor.value descriptor.value = (...args) => { console.time(element.key) const ret = oldMethod.apply(this, args) console.timeEnd(element.key) return ret } } } @decoratorclass class Numberic { number = '3.1415926' static name = 'Bob' add (...num) { return num.reduce((p, n) => (p + n), 0) } all () { return '1' } } new Numberic().add(1, 1, 1) new Numberic().all(1, 1, 1)
控制台输出
相关推荐
Wmeng0 2020-06-14
VitaLemon 2020-08-23
嵌入式移动开发 2020-08-17
Web前端成长之路 2020-07-07
wbczyh 2020-07-05
iconhot 2020-06-26
tangjikede 2020-06-21
82244951 2020-05-31
Cricket 2020-05-31
czsay 2020-05-25
FCLAMP 2020-05-19
dageda 2020-04-21
火焰雪人 2020-05-09
yundashicom 2020-05-09
junzi 2020-04-22
xuguiyi00 2020-04-11
zhaowj00 2020-04-08
是一道经常出现在前端面试时的问题。如果只是简单的了解new关键字是实例化构造函数获取对象,是万万不能够的。更深入的层级发生了什么呢?同时面试官想从这道题里面考察什么呢?下面胡哥为各位小伙伴一一来解密。
haohong 2020-04-08
付春杰Blog 2020-03-26