關於defineReactive等使用細節需要自行了解
一些關鍵知識點
$mount時 會 new Watcher 把元件的 updateComponent 方法傳給watcher 作為getter
在watcher的get中通過pushTarget 把當前watcher賦值給Dep.target
Dep的作用是排程中心/訂閱器，在defineReactive 為每一個屬性都例項話了一個Dep, 對用到該屬性的Watcher進行管理（getter中收集，setter中通知）
Watcher是訂閱者/觀察者
資料的Dep的subs陣列存放這個資料所繫結的觀察者物件，觀察者物件的deps陣列中存放著與這個觀察者有關的資料Dep。所以資料的Dep與Watcher其實是多對多關係
$watch和computed觀察者是在created生命鉤子函式前就建立完畢並且繫結的，而render觀察者是在mounted之前建立並繫結的，所以同一個元件中，render觀察者的id會大於其他觀察者（id是在後面執行佇列裡面升序排序的時候的依據）。 換句話說，在同一個元件的觀察者中，當資料發生改變的時候，渲染函式觀察者一定是最後執行的。 這個很好理解，其他觀察者中難免會對資料進行修改，如果渲染函式觀察者先執行了，然後其他觀察者對資料進行改變的話，那麼沒辦法將資料準確呈現在頁面上，導致資料不一致性。
defineReactive --》 const dep = new Dep() --> getter中 --> dep.append() --> Dep.target.addDep(this) 這個this 就是當前dep例項 --> Dep.target是一個watcher watcher.addDep 會把當前watcher加入到 dep例項中。
流程圖
