優勢：可以監聽動態新增的屬性；
可以監聽刪除的屬性 ；
可以監聽陣列的索引和 length 屬性；
包含乙個描述元件選項（data、methods、props等）的物件 options；api開發複雜元件，同乙個功能邏輯的**被拆分到不同選項 ；
使用mixin重用公用**，也有問題：命名衝突，資料**不清晰；
vue3 新增的一組 api，它是基於函式的 api，可以更靈活的組織元件的邏輯。proxy的效能本來比defineproperty好，proxy可以攔截屬性的訪問、賦值、刪除等操作，不需要初始化的時候遍歷所有屬性，另外有多層屬性巢狀的話，只有訪問某個屬性的時候，才會遞迴處理下一級的屬性。解決options api在大型專案中，options api不好拆分和重用的問題。
可以監聽陣列變化設定物件為響應式物件。接收乙個引數，判斷這引數是否是物件。不是物件則直接返回這個引數，不做響應式處理。可以劫持整個物件
操作時不是對原物件操作,是 new proxy 返回的乙個新物件
可以劫持的操作有 13 種
建立***handerler，設定get/set/deleteproperty。
get
收集依賴（track）；
如果當前 key 的值是物件，則為當前 key 的物件建立*** handler, 設定 get/set/deleteproperty；
如果當前的 key 的值不是物件，則返回當前 key 的值。
set
設定的新值和老值不相等時，更新為新值，並觸發更新（trigger）。
deleteproperty
當前物件有這個 key 的時候，刪除這個 key 並觸發更新（trigger）。
接收乙個函式作為引數。作用是：訪問響應式物件屬性時去收集依賴
接收兩個引數：target 和 key
－如果沒有 activeeffect，則說明沒有建立 effect 依賴
－如果有 activeeffect，則去判斷 weakmap 集合中是否有 target 屬性
－weakmap 集合中沒有 target 屬性，則 set(target, (depsmap = new map()))
－weakmap 集合中有 target 屬性，則判斷 target 屬性的 map 值的 depsmap 中是否有 key 屬性
－depsmap 中沒有 key 屬性，則 set(key, (dep = new set()))
－depsmap 中有 key 屬性，則新增這個 activeeffect
判斷 weakmap 中是否有 target 屬性，weakmap 中有 target 屬性，則判斷 target 屬性的 map 值中是否有 key 屬性，有的話迴圈觸發收集的 effect()。
Vue面試題總結
v show和v if之間的區別 為何v for中要用key 描述vue元件生命週期 有父子元件的情況 父子元件生命週期關係 子元件更新過程 父元件更新過程 銷毀過程 vue元件如何通訊 描述元件渲染和更新的過程 雙向資料繫結v model的實現原理 對mvvm的理解 computed有何特點 為何...
Vue面試題總結（1）
vue作為前端目前最受歡迎的框架，成為了眾多公司和程式設計師的技術首選。我最近可能也要準備面試了，所以找了一些資料整合一下 重點 一定要理解vue的mvvm原理，面試必問！採用資料劫持結合發布者 訂閱者模式的方式，通過object.defineproperty 來劫持各個屬性的setter，gett...
Vue3 0系列（Vue3 0是如何變快的 ）
來說一說為什麼performance 效能比vue 2.x快1.2 2倍 這裡先提供兩個 2.1 diff演算法優化 例子 我是段落 也就是說，vue3在渲染的時候，給會改變的元素新增了靜態標記 import from vue export function render ctx,cache,pro...