前言
每一個 Angular 元件都有自己的生命周期，元件隨時會被建立也有可能隨時被註銷，之前介紹到結構性指令的時候也有稍微提到一些。而這一篇文章主要介紹的是，元件被建立的過程中程式碼運行的順序是如何？
元件的生命週期 Hook
之前在建立元件時，常常會在元件的 class 內看到兩個方法，但是從來沒有使用過。
分別是：
- constructor(){}
- ngOnInit(){}
最先執行 - 建構式 constructor()
constructor 是一個建構式，而建構式會在 class 被建立時，第一時間被執行，換句話說在 Angular 的生命週期裡面，這是第一個執行的程式碼。
不過幾乎不會寫任何程式在 constructor 內，因為當 constructor 執行時，元件尚未被初始化，所以是接不到任何資料的。
儘管如此， constructor 還是有特殊的用途，例如拿來做相依注入 ( DI )
生命週期 Hook - ngOnInit()
從這個名稱來看，應該多少會猜到是 Angular 進行 Init 初始化後會執行的程式碼。
從 ngOnInit() 開始，該元件的初始化、該元件所有必要的屬性繫結都已經完成。
也就是說可以對目前這個元件做一些初始化的動作。
舉例來說
- 設定屬性的預設值
- 發出 Ajax 的要求跟伺服器要資料，並把值寫到屬性內，透過屬性繫結呈現在 Template 上
所以這個方法算是蠻常用到的。
當 ngOnInit() 結束後就會正式進入到 Angular 的生命週期，像是進行屬性繫結、事件繫結等等。
生命週期 Hook - ngOnDestroy()
當父元件決定要摧毀目前這個子元件時，這個方法可以讓元件在被摧毀前執行特定的程式碼。
但是這個 Hook 的使用機會比較少，大部分的情況元件裡面的記憶體通常都會自動回收。
所以不需要特別地去寫程式處理這一塊，但是在少數的情況下像是搭配 Rxjs 去做一些非同步事件的訂閱，有些時候確實就必須在這個時間點做處理。
小結
關於元件的生命週期還有很多沒有介紹到，同樣也是可以等用到時在了解即可，在撰寫這篇的過程中也找到一些前輩整理好的資料：
