# Decorator
# 定义
- Decorator装饰器其实是一个对类进行处理的函数。装饰器函数的第一个参数,就是所要装饰的目标类。
- ES6+里的装饰器,依赖 ES5 的 Object.defineProperty方法实现(vue的双向绑定也依赖这个方法)
# 代码举例
下面的代码中: testable就是一个装饰器,并对Person类增加了一个属性 readonly也是一个装饰器,它对Person的属性进行readonly操作
function testable(target) {
target.isTestable = 'aa'
}
// 对类属性进行装饰
function readonly(target, name, descriptor) {
descriptor.writable = false
return descriptor
}
@testable
class Person {
@readonly
name: 'xiao A'
}
console.log('xxx', Person.isTestable, 'xxx')
setInterval(() => {
console.log(Person.name, Person.isTestable, 1)
}, 1000)
setTimeout(() => {
console.log('xiaob:')
try {
Person.name = 'xiao B'
} catch (error) {
console.log('xiaob:', error)
}
}, 5000)
注意: 装饰器只能用于类和类的方法,不能用于函数,因为存在函数提升。 如果一定要装饰函数,可以采用高阶函数的形式操作。