10 装饰器 方法装饰器 方法参数装饰器 装饰器的执行顺序

装饰器的执行顺序

属性装饰器=>方法装饰器=>类装饰器

如果有多个同类型的装饰器，先执行后面的

function logClass1(params: string) {
    return function (target: any) {
        console.log('类装饰器1');              
    }
}
function logClass2(params: string) {
    return function (target: any) {
        console.log('类装饰器2');              
    }
}
// 属性装饰器
function logProperty(params: any) {
    return function (target: any, propertyName: any) {
        console.log('属性装饰器');        
    }
}
// 方法装饰器
function logMethod(params?:any){
    return function(target:any,methodName:any,desc:any){
        console.log('方法装饰器');        
    }
}

// 方法参数装饰器
function logParams1(params?:any){
    return function(target:any,methodName:any,desc:any){
        console.log('方法参数装饰器1');        
    }
}
function logParams2(params?:any){
    return function(target:any,methodName:any,desc:any){
        console.log('方法参数装饰器2');        
    }
}

@logClass1('http://www.baidu.com')
@logClass2('xxxxxx')
class HttpClient {

    @logProperty('http://www.qq.com')
    apiUrl: string | undefined;
    constructor() {
        this.apiUrl = '我是构造函数里面的apiUrl';
    }
    @logMethod()
    getData() {
        console.log(this.apiUrl);
    }
    setData(@logParams1() params1:any,@logParams2() params2:any){

    }
}
let http=new HttpClient();

/* 输出：
属性装饰器
方法装饰器
方法参数装饰器2
方法参数装饰器1
类装饰器2
类装饰器1 */