MVC模型-视图-控制器(MVC)是一个计算机用户界面开发模型，它将信息呈现逻辑与用户交互分离开来。模型包含应用程序的数据和业务逻辑；控制器负责将用户输入转换为命令，并将其传输到模型和视图；这是维基百科的解释；该模式最初由Trygve Reenskaug在使用Smalltalk-80(1979)时设计，称为模型-视图-模型-视图-控制器-编辑器；开始的时候。后来通过《Design Patterns: Elements of Reusable Object-Oriented Software》的深入介绍，mvc彻底流行起来。只有了解MVC三个部分的职责以及这些现有的javascript框架为我们提供了什么，我们才能更好地利用这些框架。让我们通过组成MVC的三个部分来了解每个部分的职责是什么【以主干为例给出演示代码】。模型模型管理应用的数据。当模型数据发生变化时，它会通知它的侦听器[大概是view]，在收到通知后，侦听器会做出相应的改变。

视图查看当前模型的视觉显示。视图将观察模型的变化，在模型变化时得到通知，并允许视图自行更新。通常，我们将使用模板引擎来渲染视图中的模型。

控制器控制器是模型和视图之间的中介，它的工作是在模型改变时更新视图，在用户操作视图时更新模型。

Javascipt mvc框架与不同的人相比有不同的比较方法，关键看你注意什么：1。如果你更关注框架的URL路由、数据存储、视图实现等细节，可以在这里重点关注一下，javascript王座：框架理论之剑；2.如果你多关注框架的具体例子，有一个开源项目，在同一个演示中使用了不同的javascript mvc框架，所以你可以清楚地看到每个框架在具体应用中的差异。在这种情况下，TodoMVC的官方网站MVC带来的好处是：1。易于维护；2.模型视图的解耦。这意味着更好的业务逻辑单元测试。3.代码可以重用。4.模块化开发可以使分工更加明确。有些人关注业务逻辑，有些人关注用户界面。5.回顾经典的mvc模型，我们理解了应用程序分层的概念和每一层的职责。同时，我们应该能够识别所有javascript mvc框架和我们解释的经典mvc模型之间的区别。在这种情况下，我们在选择mvc框架时，应该重点关注如何实现模型、模型、视图、控制器，甚至具体的代码如何实现，这样才能帮助我们更好地选择最适合自己的javascript mvc框架。

MVVMMVVM的全称是Model View ViewModel，最初由微软的MartinFowler提出，作为微软软件表示层设计模式的规范。它是MVC模式的衍生，而MVVM模式的重点是支持事件驱动的UI开发平台，比如HTML5。[2] [3] Windows演示基金会(WPF)，Silverlight和t . ZK框架，Adobe Flex。该模型的实现大多是通过在视图层声明数据绑定与其他层分离，方便了前端开发人员和后端开发人员的分工。前端开发人员在html标记中为viewmodel编写绑定数据，后端开发人员通过开发应用程序逻辑来维护这两个层。近年来，mvvm模式已经在javascript中实现。目前比较成熟的框架有KnockoutJS、Kendo MVVM和Knockback.js，我们以KnockoutJS为例，看看MVVM模式四个部分的具体职责和示例代码，了解使用这种模式开发的优缺点。Model与mv*家族的其他成员一样，代表特定领域的数据或应用所需的数据，如用户信息[用户名、头像、电子邮件、电话]或一首音乐的信息[歌曲名称、发行年份、专辑]；模型只关注数据信息，不关心任何行为；他没有义务不格式化数据或影响数据在浏览器中的显示。格式化数据是视图层的任务，业务逻辑层封装在视图模型中与模型交互。模型层的一个意外行为是验证数据，比如用户输入邮件时判断邮件格式是否正确。在KnockoutJS中，模型基本上是按照上面的定义实现的，但是会通过ajax调用服务器服务来读写Model数据。

视图是指应用程序中直接与用户交互的部分。它是一个交互式UI来表达视图模型的状态。这个观点被认为是主动的，而不是被动的？这句话的意思是被动View在应用中不关心模型的领域，模型的领域是在控制器中维护的；MVVM的活动视图包括需要理解模型和视图模型的数据绑定、事件和行为。虽然这些行为可以对应属性，但是view仍然需要响应viewmodel的事件，view不负责控制状态。KnockoutJS的视图层是一个简单的html文档，其中包含与ViewModel相关的数据声明。同时，KnockoutJS的视图层显示从viewmodel获得的数据，向viewmodel传输命令，并更新viewmodel的已更改状态。

视图模型可以认为视图模型是一个专门用于数据转换的控制器，它可以将模型中的信息转换成视图中的信息，同时从视图向模型发送命令。从这个意义上说，视图模型看起来更像一个模型，但它控制着视图的许多显示逻辑。同时，viewModel还公开了一些方法来维护View的状态，并根据View的行为和事件更新模型。综上所述，ViewModel位于UI层的后面，将数据暴露给View，可以认为是View层中数据和行为的来源。KnockoutJS将ViewModel解释为ui上数据呈现和性能的行为。它不是UI需要持久化的数据模型，但是可以保存用户存储的数据。knowledge的ViewModels是用javascript对象实现的，不关心html标签。这个抽象方法可以使它们的实现保持简单。

优点：1。MVVM让并行开发变得更容易，让前端开发人员和后端开发人员互不影响。2.抽象视图层减少了代码3中的业务逻辑。ViewModel比事件驱动的更容易测试。4.ViewModel的测试并不关心uI自动化和交互的缺点：1。对于简单的ui，使用MVVM有点太重了。2.声明式数据绑定不利于调试，因为命令式代码很容易设置断点，所以这种模式不利于设置这样的断点。您也不希望最终出现绑定比被绑定对象更复杂的情况。4.在大型应用中，很难在获得大量概括之前设计视图模型层。