MVC与MVVM模式的区别

参考链接：

• MVC与MVVM模式的区别

（一） MVC

1. MVC组成：

MVC思想 ：Controller负责将Model的数据用View显示出来。

MVC	解释
① Model（模型）	是应用程序中用于处理应用程序数据逻辑的部分。通常模型对象负责在数据库中存取数据。处理数据的crud
② View（视图）	是应用程序中处理数据显示的部分。通常视图是依据模型数据创建的。视图层，前端
③ Controller（控制器）	是应用程序中处理用户交互的部分。控制器负责从视图读取数据，控制用户输入，并将数据发送给模型。一般包括业务处理模块和router路由模块

2. MVC优点：

• 耦合度低（运用MVC的应用程序的三个部件是相互独立的，改变其中一个不会影响其他两个）；
• 重用性高（多个视图可以使用同一个模型）
• 生命周期成本低
• 部署快（业务分工明确）
• 可维护性高

3. MVC缺点：

• 不适合小型项目开发
• 视图与控制器联系过于紧密，妨碍了它们的独立重用

（二） M V VM——视图模型双向绑定（谈谈你对M V VM开发模式的理解）

1. MVVM 组成：

MVVM由Model，View，ViewModel三部分构成。

M V VM	解释
Model	代表数据模型（Vue的data），数据和业务逻辑都在Model层中定义；
View	代表UI视图，负责数据的展示（Vue的el）；
ViewModel	是一个对象，负责监听 Model 中数据的改变并且控制View视图的更新，处理用户交互操作；

• Model 和 View 并无直接关联，而是通过 ViewModel 来进行交互的（即双向数据绑定），
• Model 和 ViewModel之间有着双向数据绑定的联系。 View的变化可以引起Model的变化，Model的变化也可以引起View变化（类似于浅拷贝）。ViewModel是View和Model层的桥梁，数据会绑定到viewModel层并自动将数据渲染到页面中，视图变化的时候会通知viewModel层更新数据。

2. MVVM 优点：

• 低耦合：
  • 视图（View）可以独立于Model变化和修改，一个Model可以绑定到不同的View上，
  • 当View变化的时候Model可以不变化，当Model变化的时候View也可以不变；
• 可重用性：你可以把一些视图逻辑放在一个Model里面，让很多View重用这段视图逻辑。
• 独立开发：双向数据绑定的模式，实现了View和Model的自动同步，因此开发者只需要专注对数据的维护操作即可，而不需要一直操作 dom。 可以实现双向绑定的标签：Input，textarea，select标签等（可以输入或改变标签内容的标签）

[ 延伸问题 ]

（1）MVC与MVVM有什么区别⭐⭐⭐⭐⭐

• MVVM 和 MVC都是一种设计思想。
• MVVM 与 MVC 最大的区别就是：它实现了View和Model的自动同步
  • 当Model属性改变时，不用手动操作Dom元素去改变View的显示。
  • 而改变属性后，该属性对应View的显示会自动改变

（2）阐述一下你所理解的MVVM响应式原理⭐⭐⭐⭐⭐

• vue是采用数据劫持配合发布者-订阅者的模式的方式，
  • 通过Object.defineProperty()来劫持各个属性的getter和setter，
  • 在数据变动时，发布消息给依赖收集器（dep中的subs），去通知（notify）观察者，做出对应的回调函数，更新视图
• MVVM作为绑定的入口，整合Observer,Compile和Watcher三者，
  • 通过Observer来监听model数据变化，
  • 通过Compile来解析编译模板指令，
  • 最终利用Watcher搭起Observer，Compile之间的通信桥路，
  • 达到数据变化Observer）=>视图更新；视图交互变化=>数据model变更的双向绑定效果。