1、所謂數據響應式就是能夠使數據變化可以被檢測並對這種變化做出響應的機制。 2、MVVM框架要解決的一個核心問題是連接數據層和視圖層,通過數據驅動應用,數據變化,視圖更新,要做到這點的就需要對數據做響應式處理,這樣一旦數據發生變化就可以立即做出更新處理。 3、以vue為例說明,通過數據響應式加上虛擬 ...
1、所謂數據響應式就是能夠使數據變化可以被檢測並對這種變化做出響應的機制。
2、MVVM框架要解決的一個核心問題是連接數據層和視圖層,通過數據驅動應用,數據變化,視圖更新,要做到這點的就需要對數據做響應式處理,這樣一旦數據發生變化就可以立即做出更新處理。
3、以vue為例說明,通過數據響應式加上虛擬DOM和patch演算法,開發人員只需要操作數據,關心業務,完全不用接觸繁瑣的DOM操作,從而大大的提升了開發效率,降低開發難度。
4、vue2中的數據響應式會根據數據類型來做不同處理,如果是對象則採用Object.defineProperty()的方式定義數據攔截,當數據被訪問或發生變化時,我們感知並做出響應;如果是數組則通過覆蓋數組對象原型的7個變更方法,使這些方法可以額外的做更新通知,從而做出響應。這種機制很好的解決了數據響應式的問題,但在實際使用中也有一些缺點;比如初始化時遞歸遍歷也會造成性能損失;新增或刪除屬性時,需要用戶使用Vue.set/delete這樣特殊的api才能生效;對於ES6中新產生的Map、Set這些數據結構不支持等問題。
5、為瞭解決這一問題,vue3重新編寫了這一部分實現;利用ES6的Proxy代理要響應化的數據,它有很多好處,變成體驗也是一致的,不需要是使用特殊API,初始化性能和記憶體消耗得到了大幅改善;另外由於響應化的實現代碼抽取為獨立的reactive包,使得我們可以更靈活的使用它,第三方的擴展開發起來更加靈活了