vue的生命週期是什麼呢？

在vue的建立，使用，銷燬過程中，會有許多事件，這些事件就被統稱為生命週期函式，也叫作生命週期鉤子。
一般來說，生命週期包括：

beforeCreat   created  beforeMount  mounted  beforeUpdate  updated
beforeDestory  destoryed

首先，我們可以進行簡單的歸類：

建立期間生命週期函式：beforeCreat，created，beforeMount，mounted
執行期間生命週期函式：beforeUpdate，updated
銷燬期間生命週期函式：beforeDestroy，destroyed
 

建立階段：

第一個生命週期函式：beforeCreat，當執行beforeCreat生命週期函式時，vue例項
還沒有被完全創建出來，此時data，methods等內部沒有初始化，我們這個時候在函式
內呼叫資料的話，後臺會顯示undefined。把data選項上的屬性放到this上，遍歷data
選項，給每個屬性新增getter/setter(劫持)

第二個生命週期函式：created，執行這個函式的時候，vue例項已經初始化了，可以在
這裡呼叫資料，不過還沒渲染到頁面上。 在當前函式中我們可以訪問到data中的屬性，
此時，會將data中的屬性和methods的方法新增到vue的例項身上，同時會將data中所
有的屬性新增一個getter/setter方法。如果需要進行前後端上資料互動(ajax請求的
時候) 需要在當前生命週期中使用。找el、找template，得到有效的檢視結構，把
template選項編譯成render函式（為了生成虛擬DOM作準備）

第三個生命週期函式：beforeMount，這時，呼叫render方法第一次生成虛擬DOM，vue
已經將模板字串編譯成記憶體DOM，模板已經編譯完成，還沒有渲染到頁面上。

'ps:什麼是虛擬dom？本質上就是一個json資料，用於描述檢視結構，儲存在檢視中
為什麼要使用虛擬dom呢？有了虛擬dom，就可以避免我們頻繁的操作dom，降低人為的dom
濫用，可以提升web的效能。根據虛擬dom結構，第一次初始化檢視結構（生成真實的dom），
這裡會產生第一次的touch，toach的結果是依賴收集'

第四個生命週期函式：mounted，建立階段完成，頁面渲染完畢，進入執行階段。此時
我們可以通過$refs來訪問到真實的DOM結構。ref類似與id一樣 值必須是唯一的，訪問
的時候我們可以使用this.$refs.屬性
 

執行階段

當資料發生變化，比如觸發了點選事件改動資料
beforeUpdate：記憶體中的資料已經改變，頁面上的還沒更新根據新的data，render生成新
的虛擬DOM，此時在電腦記憶體中就有了兩個虛擬DOM。patch(newVnode、oldVnode) => diff，
使用diff運算找出新舊虛擬DOM之間的最小差異，通知Watcher來更新它們，檢視再次更新完成。
updated：頁面上資料和記憶體中的一致，條件：當路由切換或呼叫this.$destroy()時

銷燬階段

beforeDestroy：出發這個函式時，還沒開始銷燬，此時剛剛脫離執行階段。data，methods，
指令之類的都在正常執行。在這個生命週期函式中我們可以將繫結的事件進行移除。清除快取，
關閉定時器。拆卸掉當前元件對應的Watcher、解綁當前元件中事件處理器；遞迴拆卸掉（強制
銷燬）所有的子元件。
destroyed：元件銷燬完畢，data，methods，指令之類的不可用。