MVVM 模式框架下的开发思维

MVVM 模式，Model-View-ViewModel (模型-视图-视图模型)，最早出现在微软的 WPF 和 SilverLight 框架中。MVVM 模式利用框架内置的双向绑定技术对 MVP (Model-View-Presenter) 模式变形，它引入了专门的 ViewModel (视图模型)来“粘合” View 和 Model，让 View 和 Model 进一步分离和解耦。

MVVM 模式的要点是：以领域对象 (Domain Model) 为中心，遵循“分离关注点”设计原则，这与 jQuery 的 DOM 驱动思维有显著差异，所以在做 MVVM 开发时应该谨记：

前端开发工程师不要先设计页面，然后用 DOM 操作去改变它。

在以往的 jQuery 开发中，我们会首先设计页面 DOM 结构，然后再复用 jQuery 来改变 DOM 结构或者实现动态交互效果。由于 jQuery 是为 DOM 驱动而设计的，所以对于拥有复杂交互逻辑的项目，JavaScript 代码会变得越来越臃肿，让交互逻辑分散到各处。

在 MVVM 模式框架中，我们要始终在脑子里挂着 Model 的弦。不能老想着“我有×××这个DOM，我要让它做×××变化”，而应该是先思考我们有或需要什么样的 Model 数据，然后设计我们的交互数据和交互逻辑，最后才去实现视图，并用 ViewModel 去粘合它们。

——《AngularJS深度剖析与最佳实践》