mvvm&MVC、观察者模式、双向绑定原理、虚拟dom、diff算法、响应式布局

MVC&MVVM
双向绑定原理
观察者模式
虚拟DOM
（此文章用来先占坑，后面会更新详细一些）

MVC&MVVM

先看这样一张图
MVC的思想：一句话描述就是controller负责将model的数据用view显示出来

但是这样有一些问题就是：
1.开发者需要大量调用相同的DOM API，操作冗余，代码难以维护
2.降低页面渲染性能，
3.当Model层变化，开发者需要主动更新到view，当用户页面操作导致数据发生变化，开发者也需要同步到model中。

而MVVM 出现了，它的核心思想就是通过双向数据绑定原理把view层和model层连接起来，它俩之间的数据同步工作完全是自动的，无需人为干涉，因此开发者只需要关注业务逻辑，不需要手动操作DOM，不需要关注数据状态的同步问题，复杂的数据状态维护全部由MVVM统一管理。

区别：
MVC也是一种设计思想，主要就是MVC中的Controlled演变成MVVM中的ViewModel。MVVM主要解决了MVC中大量的DOM操作使页面渲染性能降低，加载速度变慢，影响用户体验。和当Model频繁发送变化，开发者需要主动更新到View。

双向数据绑定原理

利用Object.defineProperty()对数据进行劫持，设置一个监听器Observer，用来监听所有属性，如果属性上发生变化了，就需要告诉订阅者Watcher去更新数据，最后指令解析器Compile解析对应的指令，进而会执行对应的更新函数，从而更新视图，实现双向绑定。

观察者模式（Observer）

观察者模式又被称为发布-订阅者模式或消息机制，它定义了对象间的一对多的依赖关系，只要一个对象的状态改变时，所有依赖于它的对象都得到通知并被自动更新，解决了主体对象与观察者之间功能的耦合。
平常对DOM的事件绑定就是一个非常典型的发布-订阅者模式，我们需要监听用户点击按钮这个动作，所以订阅按钮上的click事件，只要按钮被点击，就会向订阅者发布这个消息，然后做相应操作。
大致的结构是这样

const Observer = (function(){
   
        let _message = {
   }