ts-装饰器

47 阅读1分钟

0_1V1IqXmsODAvF4vo.jpeg

属性装饰器


// 属性装饰器
namespace a {
    /**
     * 
     * @params target 如果装饰的是实例属性的话,target是构造函数的原型
     * 
     * */ 
    function upperCase(target: any, key: string) {
        let oldValue = target[key]
        const getter = () => oldValue
        const setter = (newVal: string) => {
            oldValue = newVal.toUpperCase()
        }
        if(delete target[key]) {
            Object.defineProperty(target, key, {
                get: getter,
                set: setter,
                enumerable: true,
                configurable: true
            })
        }
    }
    class Person {
        @upperCase
        name: string = 'test'
        static age: number = 18 // 静态属性
        getName() {
            console.log(this.name)
        }
        sum (...args: number[]) {
            return args.reduce((item: number, total: number) => item + total, 0)
        }
    }
    const p = new Person()
    console.log(p.name)
}

以上是一个简单的属性装饰器的demo, 那么问题来了,装饰器在实际开发中有用到吗?或者说什么时候用装饰器呢?