因主要的技術棧是angular,對於angular採用的裝飾器特別認可,是一種優雅的攔截js的方式。
目前decorator仍處於stage 2的階段,不知道能否在es2019(es10)中推出,但乙個提案只要能進入stage 2,就基本會包括在以後的正式標準裡面。
有n多文章寫道decorator是es2016(es7)推出的,不知道這是從**流傳出來的,es2016最終特性根本就沒有decorator,可能的原因:decorator只是有望在es2016推出的,實際上並沒有。
以angular中的乙個元件為例,來說明裝飾器的主要用法和裝飾器到底是什麼:
@component()
@autounsubscribe()
export
class
transfercommoncomponent
implements
oninit
ngoninit()
// 跳轉到新增
@getproperty
gotoadd()
/* ngondestroy() */
}複製**
一.類裝飾器
autounsubscribe是乙個自動取消訂閱的裝飾器,可傳入引數指定某個可訂閱物件不自動取消訂閱。如不需要指定,可取消外層高階函式
export
function
autounsubscribe(params: string) }};
};}複製**
1.類裝飾器僅僅是乙個接受乙個引數的、被裝飾的類的建構函式,常用於修改、新增類的原型方法
2.類裝飾器傳入的constructor就是類的constructor(特指constructor(){}),如下圖紅色部分.類裝飾器作用於類的 constructor,並且觀察、修改或者替換乙個類的定義。
3.this是整個class,如圖天藍色外框 4.特殊的是:類的屬性方法在類的__proto__中,其他的是類的直接子集,如圖靑藍色部分
4.引數constructor === this.constructor
5.執行訂閱的時候,訂閱的是乙個subscribe物件,property.unsubscribe是從原型鏈上獲取的unsubscribe,如下圖綠色部分
二.類屬性(方法)裝飾器
// 下乙個事件佇列中執行的裝飾器
export
const timeoutdecorator = function (milliseconds: number = 0
) , milliseconds);
};console.log(descriptor);
return descriptor;
};};export
const getproperty = function (target, name, descriptor) ;
console.log(descriptor);
return descriptor;
};複製**
1.類方法裝飾器是乙個函式,函式引數就是object.defineproperty中的三個引數即:target(目標物件)、key(呼叫的屬性名)、descriptor(呼叫的屬性的描述,包括configurable、enumerable、writable、value)
2.類方法裝飾器的作用是把類中的方法放入裝飾器中執行,個人理解類似於管道或者***
3.類的普通屬性(不是方法的)也可以新增裝飾器,比如angular中的@viewchild,@viewcontent
三.修飾器本質就是編譯時執行的函式
注意,不管哪種修飾器,對類的行為的改變,是**編譯時(初始化時)發生的,而不是在執行時。這意味著,修飾器能在編譯階段執行**。也就是說,修飾器本質就是編譯時執行的函式。
四.特別注意:this
箭頭函式中的this和普通函式的this是不同的,注意函式體內是否有this,有的話就不要用箭頭函式了,詳情請搜尋箭頭函式的this
1.類裝飾器和類方法裝飾器是不同的,但本質都是乙個函式
2.類裝飾器常用於修改、新增類的原型方法,類方法裝飾器用於攔截類方法,需要掌握具體寫法
3.注意箭頭函式和this的搭配使用問題
Python中的 函式裝飾器到底是什麼?
在解釋 函式裝飾器之前,先說一下,類中的類方法和靜態方法。在python中完全支援定義類方法 靜態方法。這兩種方法很相似,python它們都使用類來呼叫 ps 用物件呼叫也可以 區別在於 python會自動繫結類方法的第乙個引數,類方法的第乙個引數會自動繫結到類本身 但對於靜態方法則不會自動繫結。類...
js中arguments到底是什麼?
總所周知,js是一門相當靈活的語言。當我們在js中在呼叫乙個函式的時候,我們經常會給這個函式傳遞一些引數,js把傳入到這個函式的全部引數儲存在乙個叫做arguments的東西裡面,那麼這到底是什麼東西?在js中萬物皆物件,甚至陣列字串函式都是物件。所以這個叫做arguments的東西也是個物件,而且...
js的arguments到底是什麼
類陣列物件 arguments 總所周知,js是一門相當靈活的語言。當我們在js中在呼叫乙個函式的時候,我們經常會給這個函式傳遞一些引數,js把傳入到這個函式的全部引數儲存在乙個叫做arguments的東西裡面,那麼這到底是什麼東西?在js中萬物皆物件,甚至陣列字串函式都是物件。所以這個叫做argu...