MVC（Model-View-Controller）是一种强调分离软件的业务逻辑和显示的软件设计模式。这种“分离”提供了更好的分工和改进的维护。一些其他的模式也是基于 MVC 来设计的，如 MVVM（Model-View-Viewmodel）、MVP（Model-View-Presenter）和 MVW（Model-View-Whatever）。

对 MVC 软件设计模式的三个部分可以被描述如下：

1.Model：模型持有所有的数据、状态和程序逻辑。2.View：负责界面的布局和显示。3.Controller：负责模型和界面之间的交互。

MVC 示例

想象一个简单的购物清单应用程序。我们需要的是一份本周需要购买的每件物品的名称、数量和价格的清单。下面我们将描述如何使用 MVC 实现一些功能。

模型

模型定义了应用程序应包含的数据。如果这些数据的状态发生变化，模型通常会通知视图（以便根据需要更改显示），有时也会通知控制器（如果需要不同的逻辑来控制更新的视图）。

回到我们的购物清单应用程序，模型将指定清单项应包含的数据——例如物品、价格等——以及已经存在的清单项。

视图

视图定义了应用程序的数据应如何显示。

在我们的购物清单应用程序中，视图将定义清单如何呈现给用户，并从模型中接收要显示的数据。

控制器

控制器包含逻辑，根据应用程序用户的输入更新模型和/或视图。

例如，我们的购物清单应用程序可能有输入表单和按钮，允许我们添加或删除物品。这些操作需要更新模型，因此输入发送到控制器，控制器然后适当地操作模型，接着模型发送更新的数据给视图。

不过，你可能也想仅仅更新视图以不同的格式显示数据，例如按字母顺序排列项目，或按价格从低到高排列。在这种情况下，控制器可以直接处理这一需求而无需更新模型。

MVC 模式的应用程序的目的就是希望打破以往应用程序使用的大杂烩程序撰写方式，并间接诱使开发人员以更高的架构导向思维来思考应用程序的设计，因此对于一个刚入门的初学者来说，架构导向的思考会有一定的门槛，需要较多的实现与练习才能具备相应的能力，大多数的初学者还是较习惯于大杂烩式的程序撰写，所以可能会对 MVC 模式抱持着排斥或厌恶的心态，然而 MVC（或是其他的设计模式）都是有助于应用程序长远的发展，虽然大杂烩式的程序也可以用来发展长生命周期的应用程序，但是相较于 MVC，大杂烩式的程序在可扩展性和可维护性 (尤其是可测试性) 上会远比 MVC 复杂很多，相反的，MVC 模式的应用程序是在初始开发时期必须先思考并使用软件架构，使得开发时期会需要花较多心力，但是一旦应用程序完成后，可扩展性、可维护性和可测试性反而会因为 MVC 的特性而变得容易。

这里有一个通过 JavaScript 所实现的基于 MVC 模型，需要注意的是：MVC 不是一种技术，而是一种理念。

/** 模拟 Model, View, Controller */var M = {}, V = {}, C = {};
/** Model 负责存放资料 */M.data = "hello world";
/** View 负责将资料输出给用户 */V.render = (M) => { alert(M.data); }
/** Controller 作为连接 M 和 V 的桥梁 */C.handleOnload = () => { V.render(M); }
/** 在网页读取的时候呼叫 Controller */window.onload = C.handleOnload;

在这个简短的程序中就是一个完整的 MVC 模式。