js 实现双向绑定的三种方法

手动绑定

订阅发布模式
原理:
监听改变 view 的事件,比如keyup,监听到这个事件后,触发遍历并修改 dom 的函数。
一般通过在数据对象上定义get和set方法(或其它方法),调用时手动调用get或set数据,改变数据后出发UI层的渲染操作

脏检查

以典型的mvvm框架angularjs为代表,angular通过检查脏数据来进行UI层的操作更新;
主要是通过设置的数据来寻找与该数据相关的所有元素,然后再比较数据变化,如果变化则进行指令操作

前端数据劫持

基本思路是使用Object.defineProperty对数据对象做属性get和set的监听,当有数据读取和赋值操作时则调用节点的指令,这样使用最通用的=等号赋值就可以了。

Comments
Write a Comment