Decorator 装饰器
Angular大量使用了JS的装饰器特性，先看 ruanyifeng的介绍
使用babel转换 步骤 ：
- npm install -g babel-cli
- npm init; npm install --save-dev babel-plugin-transform-decorators-legacy
- babel --plugins transform-decorators-legacy 1.js > 1.es5.js
例1
@eat
class Person {
constructor() {}
}
function eat(target, key, descriptor) {
console.log('吃饭');
console.log(target);
console.log(key);
console.log(descriptor);
target.prototype.act = '我要吃饭';
}
const jack = new Person();
console.log(jack.act);转换后
var _class;
let Person = eat(_class = class Person {
constructor() {}
}) || _class;
function eat(target, key, descriptor) {
console.log('吃饭');
console.log(target);
console.log(key);
console.log(descriptor);
target.prototype.act = '我要吃饭';
}
const jack = new Person();
console.log(jack.act);
// 吃饭
// [Function: Person]
// undefined
// undefined
// 我要吃饭例2
function mixins(...list) {
return function (target) {
Object.assign(target.prototype, ...list);
};
}
const Foo = {
foo() { console.log('foo') }
};
@mixins(Foo)
class MyClass {}
let obj = new MyClass();
obj.foo() // "foo"babel 后
var _dec, _class;
function mixins(...list) {
return function (target) {
Object.assign(target.prototype, ...list);
};
}
const Foo = {
foo() {
console.log('foo');
}
};
let MyClass = (_dec = mixins(Foo), _dec(_class = class MyClass {}) || _class);
let obj = new MyClass();
obj.foo(); // "foo"本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2018.12.09 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读