你是如何理解Vue的響應式系統的

1.響應式系統簡述:
任何一個 Vue Component 都有一個與之對應的 Watcher 實例。
Vue 的 data 上的屬性會被添加 getter 和 setter 屬性。
當 Vue Component render 函數被執行的時候, data 上會被 觸碰(touch), 即被讀, getter 方法會被調用, 此時 Vue 會去記錄此 Vue component 所依賴的所有 data。(這一過程被稱為依賴收集)
data 被改動時（主要是用戶操作）, 即被寫, setter 方法會被調用, 此時 Vue 會去通知所有依賴於此 data 的組件去調用他們的 render 函數進行更新。

2.既然Vue通過數據劫持可以精准探測數據變化,為什么還需要虛擬DOM進行diff檢測差異?
考點: Vue的變化偵測原理
前置知識: 依賴收集、虛擬DOM、響應式系統

現代前端框架有兩種方式偵測變化,一種是pull一種是push

pull: 其代表為React,我們可以回憶一下React是如何偵測到變化的,
我們通常會用setStateAPI顯式更新,然后React會進行一層層的Virtual Dom Diff操作找出差異,然后Patch到DOM上,
React從一開始就不知道到底是哪發生了變化,只是知道「有變化了」,然后再進行比較暴力的Diff操作查找「哪發生變化了」，
另外一個代表就是Angular的臟檢查操作。

push: Vue的響應式系統則是push的代表,當Vue程序初始化的時候就會對數據data進行依賴的收集,
一但數據發生變化,響應式系統就會立刻得知,因此Vue是一開始就知道是「在哪發生變化了」,
但是這又會產生一個問題,如果你熟悉Vue的響應式系統就知道,通常一個綁定一個數據就需要一個Watcher,
一但我們的綁定細粒度過高就會產生大量的Watcher,這會帶來內存以及依賴追蹤的開銷,而細粒度過低會無法精准偵測變化,
因此Vue的設計是選擇中等細粒度的方案,在組件級別進行push偵測的方式,也就是那套響應式系統,通常我們會第一時間偵測到發生變化的組件,
然后在組件內部進行Virtual Dom Diff獲取更加具體的差異,而Virtual Dom Diff則是pull操作,
Vue是push+pull結合的方式進行變化偵測的

3.Vue為什么沒有類似於React中shouldComponentUpdate的生命周期？
根本原因是Vue與React的變化偵測方式有所不同

React是pull的方式偵測變化,當React知道發生變化后,會使用Virtual Dom Diff進行差異檢測,
但是很多組件實際上是肯定不會發生變化的,這個時候需要用shouldComponentUpdate進行手動操作來減少diff,從而提高程序整體的性能.

Vue是pull+push的方式偵測變化的,在一開始就知道那個組件發生了變化,因此在push的階段並不需要手動控制diff,
而組件內部采用的diff方式實際上是可以引入類似於shouldComponentUpdate相關生命周期的,但是通常合理大小的組件不會有過量的diff,手動優化的價值有限,
因此目前Vue並沒有考慮引入shouldComponentUpdate這種手動優化的生命周期