MVVM & MVC & 双向数据绑定

1. MVC和MVVM有什么区别 click
   都是为了解决Model和View耦合的问题
   1、mvvm各部分的通信是双向的，而mvc各部分通信是单向的；
   2、mvvm是真正将页面与数据逻辑分离放到js里去实现，而mvc里面未分离。

MVC：主要应用于后端，前端早期也有应用，有点事分层清晰，缺点是数据流混乱，灵活性带来维护性问题

MVP：MVC的进化，presenter作为中间层负责MV通信，解决了耦合问题，大P层过于臃肿导致维护问题

MVVM：不仅解决了MV耦合问题，还解决了维护两者映射关系的大量繁杂代码和DOM 操作代码，在提高开发效率，可读性同时还保持了优越的性能表现。
ViewModel：1、通过实现一套数据响应式机制自动响应Model中数据变化
2、实现一套更新策略自动将数据变化转换为视图更新
3、通过事件监听响应View中用户交互，修改Model中数据
4、ViewModel中减少了大量DOM操作（虚拟DOM做更新）
5、减少了View和Model松耦合的同时，还减少了维护他们关系的代码，使用户专注于业务逻辑，兼顾开发效率和可维护性。

2. v-bind和v-model区别。
   v-bind：数据变化==>视图变化，是单向的。绑定数据和属性以及表达式，click；
   v-model：双向数据绑定，表单元素（input、textarea、select）外不起作用。
3. vue双向数据绑定的实现
   文章： click
   详解：click
   视频：click
   微信文章click

视图变化影响属性通过绑定监听事件
数据影响视图：观察者（observer）观察数据，当发现数据发生变化的时候通知所有的订阅者（watcher）更新视图，如下：
1、对所有的data进行响应化处理（劫持监听所有data，数据更新视图通过Object.defineProperty(obj,prop,descriptor)的set方法）==> observe
2、编译模板，找到其中动态绑定的数据，使用data初始化视图 ==>compile
3、每个节点定义一个订阅者（watcher）和一个更新函数，当数据发生变化时watcher便调用对应更新函数
4、data中一个key被视图多个地方使用，需要为每一个key定义一个管理watcher的管家：dep
5、key发生变化便通知dep，dep通知所有watcher执行更新函数（set中进行）

VUE2.0版本核心为Object.defineProperty(obj,prop,descriptor)，翻译：为对象定义属性，它的set方法用于数据劫持，并通知所有watcher。obj：定义其上属性的对象；prop：要定义或修改的属性；descriptor：具体的改变方法。obj.prop调用其get方法，get方法中添加订阅者；obj.prop = ‘something’ 调用其set方法。通过劫持setter,实现model到view。
ES6原生使用proxy修改get、set实现数据劫持：let obj1=new Proxy(obj2,handler)，将obj1是obj2包装后的对象，仅多了一层包装，当访问对象时一定经过拦截
详细实现 ---->【数据劫持】结合【发布-订阅】的方式实现。