資料繫結原理

看風景就發表於2016-12-06

資料繫結的常用方法

1. 釋出訂閱 + 事件監聽

掃描dom模板,編譯dom模板,得到對於的釋出訂閱函式,生成對應的dom元素,賦值和取值基於函式,代表knockoutjs

2. 髒值檢查

通過對比資料是否有變更,來決定檢視是否更新。例如angular.js,會在特定事件觸發下,進行髒值檢查,
例如:
DOM事件,譬如使用者輸入文字,點選按鈕等。( ng-click )
XHR響應事件 ( $http )
瀏覽器Location變更事件 ( $location )
Timer事件( $timeout , $interval )
執行 $digest() 或 $apply()

3. 資料劫持

基於Object.defineProperty()的set和get方法對資料屬性進行劫持,賦值時執行set方法,取值時執行get方法。
利用釋出訂閱的方式執行dom更新,代表vue.js

相關文章