以大见小，从了解MVC，MVP，MVVM 开始学习前端。

 不要再脱口而出mvc、mvvm设计模式......我们很多程序猿往往把框架模式和设计模式混淆，认为MVC是一种设计模式。实际上它们完全是不同的概念。

---------------------------------------------------------------------------------------------------------

框架通常是代码重用，

而设计模式是设计重用，

架构则介于两者之间，部分代码重用，部分设计重用，有时分析也可重用。

---------------------------------------------------------------------------------------------------------

简而来说就是：

       框架 是大智慧，用来对软件设计进行分工；

       设计模式 是小技巧，对具体问题提出解决方案，以提高代码复用率，降低耦合度。

框架模式：MVC、MTV、MVP、MVVM、ORM等等；

设计模式：工厂模式、适配器模式、策略模式、观察者模式等等

---

MVC和MVVM模式的区别

MVVM是MVC的升级版本：mvc——> mvp——> mvvm

1，MVC （Model-View-Controller）

MVC模式的思想：分层思想。就是把模型与视图分离，通过控制器来连接他们。

MVC职责划分：

           M ——模型层：#业务模型：业务逻辑、流程、状态、规则（核心）。

                                    #数据模型：业务数据、数据效验、增删改查（ajax）。总的来说，M就是提供数据。

           V —— 视图层：视图、模板、用户事件、输入。简单来说，V就是html。

           C ——控制器/分发器：事件分发、视图分发、模型分发。不做业务处理、数据处理。

        服务器端MVC模式非常容易实现model：模型即数据。模型是所有js应用程序的核心，包括交互数据及相关的逻辑（转换、验证、计算属性和访问控制）。   

用流程图来理解下：       

①.后端服务器首先通过浏览器获取页面的地址，对网址进行解析，得到视图View给它的一个网址。

②然后通过控制器controller进行解析，去找对应的数据。

③找到数据后，再讲数据Model返回给控制器

④控制器controller再对数据进行加工，最后返回给视图层View。

MVC的缺点：单向的数据流。model和view中一方的数据发生改变，不会影响到另一方，不会主动同步，控制器是被动的，除非对C发起请求，要求控制器去改变。

---

2，MVVM（Model、View、ViewModel）

MVC模式的设计思想：关注数据模型（model）的变化，让MVVM框架去自动更新DOM状态，从而把开发者从操作dom的繁琐步骤中解脱出来。

（引申了解下软件开发的发展阶段：汇编—C高级—oop（c++，java）—SOA—sass（SASS,PASS,LESS））

MVVM是由微软提出来的，它借鉴了桌面的应用程序MVC思想，在前端页面中，把Model用纯jvascript对象表示，view负责显示，两者做到了最大限度的分离。

流程图理解：

viewmodel把Model和View关联起来，负责把model的数据同步到view显示出来，还负责把view的修改同步回model，实现“数据模型和数据双向绑定”，但View和Model之间没有联系。

viewmodel：a model of view，即对view的抽象 建模。与mvc中的controller相比，增加了监听和更新功能。（这里建议了解一下ooa,ood,oop思想，即object oriented analysis/design/programming）

前后端分离：