裝飾器 ： 裝飾器是一種特殊類(lèi)型的聲名 殿怜。它能夠被附加到類(lèi)聲明典蝌，方法，屬性或參數(shù)上 头谜， 可以修改類(lèi)的行為骏掀。

通俗的講 裝飾器就是一個(gè)方法 ， 可以注入到類(lèi)柱告、方法砖织、屬性參數(shù)上來(lái)拓展類(lèi)、屬性末荐、方法、參數(shù)的功能新锈。

常見(jiàn)的裝飾器有 ： 類(lèi)裝飾器甲脏， 屬性裝飾器 ， 方法裝飾器 ， 參數(shù)裝飾器
裝飾器是過(guò)去幾年中js最大的成就之一 块请，已是ES7的標(biāo)準(zhǔn)特征之一

1娜氏、裝飾器 （普通裝飾器 ， 無(wú)法傳參）

function logClass(params: any) {
    console.log(params) //這里params 打印出來(lái)的是HttpClient（）{}
    params.prototype.apiUrl = '動(dòng)態(tài)擴(kuò)展的屬性'
    params.prototype.run = function () {
        console.log('我是一個(gè)run方法')
    }
}

@logClass
class HttpClient {
    constructor() {

    }
    getData() {

    }
}
var http: any = new HttpClient()
console.log(http.apiUrl)
http.run();

2墩新、裝飾器 （裝飾器工廠 贸弥， 可以傳參）

function logClass(params: string) {
    return function (target: any) {
        console.log(target)
        console.log(params)
        target.prototype.apiUrl = params
    }
}

@logClass('http://www.baidu.com')
class HttpClient {
    constructor() {

    }
    getData() { }
}
var http: any = new HttpClient();
console.log(http.apiUrl)

3、類(lèi)裝飾器 (重載構(gòu)造函數(shù))

類(lèi)裝飾器表達(dá)式 會(huì)在運(yùn)行時(shí) 當(dāng)作函數(shù)被調(diào)用 類(lèi)的構(gòu)造函數(shù)作為其唯一的參數(shù) 海渊， 如果類(lèi)裝飾器返回一個(gè)值绵疲， 他會(huì)使用提供的構(gòu)造函數(shù)來(lái)替換類(lèi)的聲明

function logClass(target: any) {
    console.log(target) // HttpClient(){}
    return class extends target {
        apiUrl: any = '修改后的數(shù)據(jù)'
        getData() {
            this.apiUrl = this.apiUrl + '---'
            console.log(this.apiUrl)
        }
    }
}

@logClass
class HttpClient {
    public apiUrl: string | undefined
    constructor() {
        this.apiUrl = '構(gòu)造函數(shù)的api'
    }
    getData() {
        console.log(this.apiUrl)
    }
}
var http: any = new HttpClient();
http.getData() //修改后的數(shù)據(jù)--- 

4 、屬性裝飾器

屬性裝飾器表達(dá)式會(huì)在運(yùn)行時(shí)當(dāng)作函數(shù)被調(diào)用 臣疑，傳入下列兩個(gè)參數(shù)：
1.對(duì)于靜態(tài)成員來(lái)說(shuō)是類(lèi)的構(gòu)造函數(shù)盔憨，對(duì)于實(shí)例成員是類(lèi)的原型對(duì)象
2.成員的名字

function logClass(params: string) {
    return function (target: any) {
    }
}
function logProperty(params: any) {
    return function (target: any, attr: any) {
        console.log(target)
        console.log(attr)
        target[attr] = params
    }
}

@logClass('hahah')
class HttpClient {
    @logProperty ('http://www.baidu.com')
    public url:any | undefined
    constructor(){}
    getData(){
        console.log(this.url)
    }
}
var http = new HttpClient()
http.getData() //http://www.baidu.com

5讯沈、方法裝飾器

它會(huì)被應(yīng)用到方法的屬性描述符上 郁岩，可以用來(lái)監(jiān)視、修改或替換方法的定義
方法裝飾器會(huì)在運(yùn)行時(shí)傳入3個(gè)參數(shù)：
1缺狠、對(duì)于靜態(tài)成員來(lái)說(shuō)時(shí)類(lèi)的構(gòu)造函數(shù) 问慎，對(duì)于實(shí)例成員來(lái)說(shuō)時(shí)類(lèi)的原型對(duì)象
2、成員的名字
3挤茄、成員的屬性描述符

6如叼、方法參數(shù)裝飾器

參數(shù)裝飾器表達(dá)式會(huì)在運(yùn)行時(shí)當(dāng)作函數(shù)被調(diào)用，可以使用參數(shù)裝飾器為類(lèi)的原型增加一些元素?cái)?shù)據(jù)驮樊，傳入一下三個(gè)參數(shù)：
1薇正、對(duì)于靜態(tài)成員來(lái)說(shuō)時(shí)類(lèi)的構(gòu)造函數(shù) ，對(duì)于實(shí)例成員來(lái)說(shuō)時(shí)類(lèi)的原型對(duì)象
2囚衔、成員的名字
3挖腰、參數(shù)在函數(shù)參數(shù)列表中的索引

最后 ，裝飾器的執(zhí)行順序

屬性>方法>方法參數(shù)>類(lèi)（如果有多個(gè)同樣的裝飾器练湿，它會(huì)先執(zhí)行后面的）