是否需要使用前端框架
一提起框架，我想我们基本都会脱口而出angular、vue、react等等，那么它们是用来干啥的呢？
先说下以angular、backbone为代表的MV*框架和jquery的区别，像我一直在使用jquery，用得好好的，为什么要用这种框架呢？
像jquery，针对界面上的DOM操作、远程请求、数据处理等都做了封装。使用它，并不会影响自己的代码结构，它只能算个库。
而框架则是提供一套解决方案，你得按我的规定来安排代码结构，它是随着前端功能的增强而产生的，对于往应用方向发展（也就是越来越像客户端）的web产品就很必要做前端架构这件事，它开始以模型为中心，DOM操作只是附加，通过关注点分离鼓励改进应用程序。
未来的发展趋势是前后端只靠json数据进行通信，后端只处理和发送一段json到前端，计算和模板渲染都在前端进行，后台程序不再做模板的任何处理。使用MV*框架能有效实现前后端的解耦，简化开发流程，便于维护管理，可以把精力更多放到业务逻辑，提升开发效率。
所以考虑是否需要引入前端框架，可以根据产品类型做个基本判断：对于页面型产品，处理交互更多，jquery也够用；但如果是应用软件类产品，需要关注处理复杂模型，很有必要引入MV*框架。如今的互联网公司的产品基本都是web app，越来越像传统应用软件开发靠拢，使用个框架就还是很有必要的。
前端MV*
上边只是简单说了结论性的话，那么MV*又是什么呢？
MVC在javascript中的体现
view和mode之间是观察者模式，view事先在model上注册，观察model的变化，使得view可以了解model中数据的变化。
view和controller之间是策略模式，MVC允许在不改变视图外观的情况下改变视图对用户输入的响应方式。MVC将响应机制封装在controller对象中，存在着一个controller的类层次结构，使得可以方便的对原有的controller做适当改变而创建新的controller。view使用controller子类的实例来实现一个特定的响应策略，要实现不同的策略只要用不同种类的controller实例替换。
view 承接controller的功能，处理用户的输入，依赖controller决定如何进一步处理。由于view具有独立处理事件的能力，如果每次都走controller，其实增加了复杂性。同时view也可委托controller处理model的更改，model数据变化后通知view进行更新，这整体是个循环的过程。
在经典MVC中，controller要做的事情多数是派发用户输入给不同的view，并且在必要的时候从view中获取用户输入来更改model，而Web以及绝大多数现在的UI系统中，controller的职责已经被系统实现了，controller非常薄，只起到路由的作用，Backbone索性取消了controller，只保留了router。总之由于某种原因，控制器和视图的分界线越来越模糊，由于controller和view之间的分界线越来越模糊，所以就衍生了MVP,MVVM这些模式。
MVP模式
MVP中view不仅拥有UI组件的结构，还拥有处理用户事件的能力，这样就能将controller独立出来。依赖Presenter作为核心，负责从model中拿数据，填充到view中。常见的MVP的实现是被动视图(passive view),Presenter观察model，不再是view观察model，一旦model发生变化，就会更新view。Presenter有效地绑定了model到view。view暴露了setters接口以便Presenter可以设置数据。对于这种被动视图的结构，没有直接数据绑定的概念。但是他的好处是在view和model直接提供更清晰的分离。但是由于缺乏数据绑定支持，意味着不得不单独关注某个任务。在MVP里，应用程序的逻辑主要在Presenter来实现，其中的view是很薄的一层。
MVVM模式
同MVP一样，将view和model清晰的分离开来。view是对viewmodel的外在显示，view绑定到viewmodel的属性上，与viewmodel保持同步，如果viewmodel中的属性值变化了，这些新值通过数据绑定会自动传递给view。反过来viewmodel会暴露model中的数据和特定状态给view。它的好处是实现了数据的双向绑定，angular就都是使用的这种模式。
MVC、MVVM与数据绑定
MVC 的思想是表示分离，将表示业务的领域对象Model和表示GUI元素的表示对象View分离。
流同步：在一个视图的代码中显示地对其它视图进行同步，也就是一个视图改变了模型，然后告诉其它所有视图需要刷新了。
MVC中实现模型和视图的解耦，同时还可以使用观察者(使得debug困难)同步策略，自动同步数据，但对于交互相关的状态，需要流同步（会增加好多代码）。前端MVC中，controller原本负责用户和系统的连接，被系统实现了很多，从而又演化出MVP，但是他们没有双向绑定。
MVVM模式中，使用视图模板(ViewModel)的概念来维护视图所处的状态。ViewModel用来存储视图状态。controller负责ViewModel的初始化及根据视图的交互操作Model。View 和 ViewModel之间进行了数据的双向绑定。
在前端领域中，可以一句话总结MVC/MVVM的不同：MVC指的是前端和后台的交互方式，MVVM指的是页面渲染方式。
当下的前端框架
当下的框架使用MV*的设计模式（最有优势的是MVVC），它们还集合了模板、模块化、组件化的功能，而且更重要的就是为了实现组件化。这两年前端领域有三个框架/库引领时尚，那就是Angular，Polymer(google提出，web component)，React。（vue在国内使用的公司还是蛮多的，像百度外卖、饿了么、头条等等），这里有篇文章，详细分析了这几个前端框架，2015前端框架何去何从。
这三个东西各有千秋，在可以预见的几年内将会鼎足三分，也许还会有新的框架出现，能不能比这几个流行就难说了。
对于前端框架我们需要关注：
模块化
web component
变更检测(双向绑定机制)
immutable Data
promise与异步
这几个方面再留待后边学习
参考资料
http://blog.sae.sina.com.cn/archives/1060
https://github.com/xufei/blog/issues/19
http://efe.baidu.com/blog/mvc-deformation/
http://www.cnblogs.com/sskyy/p/4264371.html
网友评论