主要介绍了使用Object.defineProperty实现简单的js双向绑定的相关资料,需要的朋友可以参考下

本文实例讲述了js实现视图和数据双向绑定的方法。分享给大家供大家参考，具体如下： 前言 视图和数据绑定，使视图和逻辑层分离，使视图层变为数据驱动是前端的一大进步。由此诞生了mvvm类的前端框架，大大提升了开发的效率。 那么在使用旧有的项目中，如何使用更加先进的设计模式来替换掉大量的面向过程编程。 各大框架对于数据绑定的实现都有各自的方式，这里不做深入只是简单介绍一下。 Vue使用了es5  Object.defineProperty的特性来实现对数据读取和设置的监听，是一种元编程的方式。个人感觉

缘起 前几天在看一些流行的迷你mvvm框架（比如avalon.js、 vue.js 这种较轻的框架，而非Angularjs、Emberjs这种较重的框架）的实现。现代流行的mvvm框架一般都会将数据双向绑定（two-ways data binding）做掉，作为框架自身的一个卖点（ Ember.js 貌似是不支持数据双向绑定的。），而且每种框架双向数据绑定的实现方式都不太一致，比如Anguarjs内部使用的是 脏检查 ，而avalon.js内部实现方式的本质是设置 属性访问器 。 这里不打算具体