ECMAScript 6 修饰器（Decorator）

是一个第三方模块，提供了几个常见的修饰器，通过它可以更好地理解修饰器。（1）@autobindautobind修饰器使得方法中的this对象，绑定原始对象。import { autobind } from 'core-decorators';class Person { @autobind getPerson() { return this; }}let person = new Person();let getPerson = person.getPerson;getPerson() === person;// true（2）@readonlyreadonly修饰器使得属性或方法不可写。import { readonly } from 'core-decorators';class Meal { @readonly entree = 'steak';}var dinner = new Meal();dinner.entree = 'salmon';// Cannot assign to read only property 'entree' of [object Object]（3）@overrideoverride修饰器检查子类的方法，是否正确覆盖了父类的同名方法，如果不正确会报错。import { override } from 'core-decorators';class Parent { speak(first, second) {}}class Child extends Parent { @override speak() {} // SyntaxError: Child#speak() does not properly override Parent#speak(first, second)}// orclass Child extends Parent { @override speaks() {} // SyntaxError: No descriptor matching Child#speaks() was found on the prototype chain. // // Did you mean "speak"?}（4）@deprecate (别名@deprecated)deprecate或deprecated修饰器在控制台显示一条警告，表示该方法将废除。import { deprecate } from 'core-decorators';class Person { @deprecate facepalm() {} @deprecate('We stopped facepalming') facepalmHard() {} @deprecate('We stopped facepalming', { url: 'http://knowyourmeme.com/memes/facepalm' }) facepalmHarder() {}}let person = new Person();person.facepalm();// DEPRECATION Person#facepalm: This function will be removed in future versions.person.facepalmHard();// DEPRECATION Person#facepalmHard: We stopped facepalmingperson.facepalmHarder();// DEPRECATION Person#facepalmHarder: We stopped facepalming//// See http://knowyourmeme.com/memes/facepalm for more details.//（5）@suppressWarningssuppressWarnings修饰器抑制decorated修饰器导致的console.warn()调用。但是，异步代码发出的调用除外。import { suppressWarnings } from 'core-decorators';class Person { @deprecated facepalm() {} @suppressWarnings facepalmWithoutWarning() { this.facepalm(); }}let person = new Person();person.facepalmWithoutWarning();// no warning is logged使用修饰器实现自动发布事件我们可以使用修饰器，使得对象的方法被调用时，自动发出一个事件。import postal from "postal/lib/postal.lodash";export default function publish(topic, channel) { return function(target, name, descriptor) { const fn = descriptor.value; descriptor.value = function() { let value = fn.apply(this, arguments); postal.channel(channel || target.channel || "/").publish(topic, value); }; };}上面代码定义了一个名为publish的修饰器，它通过改写descriptor.value，使得原方法被调用时，会自动发出一个事件。它使用的事件“发布/订阅”库是Postal.js。它的用法如下。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，就会自动发出一个事件。let foo = new FooComponent();foo.someMethod() // 在"component"频道发布"foo.some.message"事件，附带的数据是{ my: "data" }foo.anotherMethod() // 在"/"频道发布"foo.some.other"事件，不附带数据Mixin在修饰器的基础上，可以实现Mixin模式。所谓Mixin模式，就是对象继承的一种替代方案，中文译为“混入”（mix in），意为在一个对象之中混入另外一个对象的方法。请看下面的例子。const Foo = { foo() { console.log('foo') }};class MyClass {}Object.assign(MyClass.prototype, Foo);let obj = new MyClass();obj.foo() // 'foo'上面代码之中，对象Foo有一个foo方法，通过Object.assign方法，可以将foo方法“混入”MyClass类，导致MyClass的实例obj对象都具有foo方法。这就是“混入”模式的一个简单实现。下面，我们部署一个通用脚本mixins.js，将mixin写成一个修饰器。export function mixins(...list) { return function (target) { Object.assign(target.prototype, ...list); };}然后，就可以使用上面这个修饰器，为类“混入”各种方法。import { mixins } from './mixins';const Foo = { foo() { console.log('foo') }};@mixins(Foo)class MyClass {}let obj = new MyClass();obj.foo() // "foo"通过mixins这个修饰器，实现了在MyClass类上面“混入”Foo对象的foo方法。不过，上面的方法会改写MyClass类的prototype对象，如果不喜欢这一点，也可以通过类的继承实现mixin。class MyClass extends MyBaseClass { /* ... */}上面代码中，MyClass继承了MyBaseClass。如果我们想在MyClass里面“混入”一个foo方法，一个办法是在MyClass和MyBaseClass之间插入一个混入类，这个类具有foo方法，并且继承了MyBaseClass的所有方法，然后MyClass再继承这个类。let MyMixin = (superclass) => class extends superclass { foo() { console.log('foo from MyMixin'); }};上面代码中，MyMixin是一个混入类生成器，接受superclass作为参数，然后返回一个继承superclass的子类，该子类包含一个foo方法。接着，目标类再去继承这个混入类，就达到了“混入”foo方法的目的。class MyClass extends MyMixin(MyBaseClass) { /* ... */}let c = new MyClass();c.foo(); // "foo from MyMixin"如果需要“混入”多个方法，就生成多个混入类。class MyClass extends Mixin1(Mixin2(MyBaseClass)) { /* ... */}这种写法的一个好处，是可以调用super，因此可以避免在“混入”过程中覆盖父类的