mvvm是什么

所谓的MVVM其实就是Model、View 和ViewModel

  • Model：模型层（数据层），主要用于保存一些数据
  • View： 视图层，主要用于将后端数据借助各种元素呈现给用户，同时也可提供用户操作的入口

  • ViewModel：视图模型层：该层也是mvvm中的核心层，主要用于作为Model和View两个层的数据连接层，负责两个层之间的数据传递。

    • DOM监听（DOM Listener） 用于监听dom元素的一些事件，如果dom元素发生变化在需要的时候会改变对应的data
    • 数据绑定（Data bindings）用于将model的改变反应在view上及时呈现给用户
    • 什么是MVVM - 图1

      MVVM的原理

      MVVM的实现分为三步：数据劫持、模板编译和双向绑定
      MVVM 的核心是数据劫持、数据代理、数据编译和”发布订阅模式”

  • 1、观察对象，给对象增加 Object.defineProperty

  • 2、vue的特点就是新增不存在的属性不会给该属性添加 get 、 set 钩子函数。
  • 3、深度响应。循环递归遍历 data 的属性，给属性添加 get ， set 钩子函数。
  • 4、每次赋予一个新对象时（即调用 set 钩子函数时），会给这个新对象进行数据劫持( defineProperty )。简单来说就是利用 Object.defineProperty()，并且把内部解耦为 Observer, Dep, 并使用 Watcher 相连。