MVC & MVVM

什么是MVC，什么是MVVM？

面向过程 --> 面向对象 --> MVC --> MV*

面向过程：

开发人员按照需求逻辑顺序开发代码逻辑，主要思维模式在于如何实现。先细节，后整体。

面向对象：

开发人员先思考整个需求该由谁(哪个对象)来实现，整个需求就是由很多对象来完成，然后在对象的具体逻辑中依然还是面向过程。封装+多态+继承，先抽象，后具体。

面向过程与面向对象的区别：

就像是电脑，面向过程是自己生产电脑，包括电路板、零件等。面向对象是自己组装电脑，硬件已生产完毕。
面向过程：吃狗(屎)；面向对象：狗吃(屎);

MVC：

确切的讲MVC是一种软件设计规范，早在1970年MVC的理念就已经诞生。不过长期以来MVC都是应用在重逻辑开发的软件领域和互联网产品的后台开发领域。

开发人员按照Model(模型) - View(视图) - Controller(控制器)相分离的逻辑进行需求开发，将输入(View)、处理(Controller)、输出(Model -> View)独立开，这种逻辑的好处在于，业务逻辑与用户界面分离之后，后期对于界面的改版以及对于用户交互的处理变化，仅仅需要改动View层即可，不在需要对业务逻辑层进行多大的改动。后期的维护成本会减少很多。

Model是需要渲染到页面中的数据模型，View是用户可以接触到的的界面，Controller是业务逻辑控制

MVVM：

开发人员只要考虑和处理Model(数据模型)的变化即可，不用考虑Model和View之间的数据绑定同步，更不用花精力用大量的代码获取DOM元素改变DOM元素的值来完成界面数据的变化。所有工作交给VM(View-Model)来处理。
图片流程
MVVM并没有业务逻辑的控制器，它通过数据双向绑定，实时更新View和Model层，当数据模型发生变化的时候，用户界面(DOM)的内容会即时更新。反之如果用户操作导致某些DOM内容变化(如input)，ViewModel也会即时的将Model数据模型更新。

实际上还有一种模式叫做MVP，P是Presenter，它与MVVM类似，但不是双向绑定。

为什么MVC？

随着互联网产品前端业务逻辑的日趋复杂，JavaScript已经从最初的仅仅实现页面动态效果，随着AJAX的诞生以及Google对于此技术的重视和推广，现在的JavaScript演变成业务逻辑越来越复杂和繁重的角色，JavaScript也完美的向世人诠释了什么才是真正的屌丝逆袭。随着网站界面的复杂化，以及越来越多的互联网产品都开始重视用户的交互体验，前端的业务逻辑和数据处理能力被更加重视，也正是随着DOM操作逻辑与业务逻辑的混杂，导致项目代码随着时间的推移越来越多，越来越混杂，越来越难以维护。最早出现的MVC理念的JS框架便是几年前进入前端领域的Backbone.js。MVC设计理念终于被应用到的前端开发的领域。也正是因为前端MVC理念的普及，更多的人认识到了前端开发工程师的价值已经不只是过去那种只做表面功夫的"伪程序员"。前端开发工程师的春天才刚刚开始。

复杂的Web App
将开发重心从DOM操作，转移到数据操作，将DOM操作与程序逻辑解耦。
期望提升开发效率、单位时间产出、后期代码扩展性，降低维护成本

MVC另一种角度来说算是一个公司技术团队的开发规范，只有规范的逻辑代码，才能获得敏捷开发的便捷和高效，也可以得到相较为规范的开发模式更好的代码扩展性和可维护性。

为什么MVVM？

数据双向绑定，开发人员不用再把精力放在DOM的修改和更新，只要通过模板引擎将数据模型和用户界面绑定，框架会实时同步双方数据的变化。减轻了开发人员的负担，也减少了DOM操作逻辑导致业务逻辑混乱的可能性。

为什么使用AngularJS

最早开始普及的前端MVC框架是Backbone，之后借鉴这种开发模式的框架如雨后春笋般进入开发者的视野。互联网巨头们也开始推出自己的MV*框架：
微软 - Knockout.js - MVVM
Google - Angular.js - MVC & MVVM
苹果 - Ember.js - MVC & MVVM
Facebook - React.js - MVVM

全栈工程师 -> MEAN解决方案

AngularJS既是MVC框架又是MVVM框架

之前有说到MVC模式就是一种开发规范，AngularJS这个MVC框架带给我们的好处就是，他经过了Google很多项目的考验，我们使用AngularJS也可以算是使用Google成熟的开发规范来进行项目开发。AngularJS这个MVC框架实际上汇集了太多太多Google的优秀理念和编程规范，这对于很多希望能统一开发规范的前端Team来说是很宝贵的。