![](https://box.kancloud.cn/b15c2be59a831428d649d0e98e21a168_448x181.png)
![](https://img.kancloud.cn/2b/e6/2be611d817861fb70761d8e78657cb6c_637x467.png)
![](https://box.kancloud.cn/20ff8445ebb6fdf3d2f12de9c569bb5c_773x136.png)
~~~
class Circle {
draw(){
console.log('画一个圆形')
}
}
class Decorator {
constructor(circle){
this.circle = circle;
}
draw(){
this.circle.draw();
this.setRedBorder(circle)
}
setRedBorder(){
console.log('设置红色边框')
}
}
let circle = new Circle();
circle.draw();
let dec = new Decorator(circle);
dec.draw();
~~~
```
@testDec
class Demo {
}
function testDec(target) {
target.isDec = true;
}
alert(Demo.isDec);//true
```
![](https://box.kancloud.cn/60dea44f96437d7565969ac7ab1232bc_493x416.png)
![](https://box.kancloud.cn/7f0a9121d76ef97d1763c901188db851_503x399.png)
![](https://box.kancloud.cn/f0d0d6166950188fc62450c824b55507_438x308.png)
~~~
function mixins(...list) {
return function (target) {
Object.assign(target.prototype, ...list)
}
}
const Foo = {
foo() { alert('foo') }
}
@mixins(Foo)
class MyClass {}
let obj = new MyClass();
obj.foo() // 'foo'
~~~
![](https://box.kancloud.cn/0141da7a03eea6b1f2d1f1ffa564352d_819x314.png)
~~~
// import { readonly } from 'core-decorators'
// class Person {
// @readonly
// name() {
// return 'zhang'
// }
// }
// let p = new Person()
// alert(p.name())
// // p.name = function () { /*...*/ } // 此处会报错
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 facepalming
person.facepalmHarder();
// DEPRECATION Person#facepalmHarder: We stopped facepalming
//
// See http://knowyourmeme.com/memes/facepalm for more details.
~~~
~~~
function log(target, name, descriptor) {
var oldValue = descriptor.value;
descriptor.value = function() {
console.log(`Calling ${name} with`, arguments);
return oldValue.apply(this, arguments);
};
return descriptor;
}
class Math {
@log
add(a, b) {
return a + b;
}
}
const math = new Math();
const result = math.add(2, 4);
console.log('result', result);
~~~
![](https://img.kancloud.cn/12/71/1271ee7085376c619aff14f5539b0e70_452x76.png)
![](https://img.kancloud.cn/a8/b4/a8b401bd5fb6f89268bfd23727a950b1_661x117.png)
![](https://img.kancloud.cn/40/fb/40fb6b4c1f05420460cdf51330431162_586x325.png)
![](https://img.kancloud.cn/1c/69/1c69c3efb8f8dc9889940a28ef6bb405_860x317.png)