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來講是很寶貴的。

AngularJS既是MVC框架又是MVVM框架

以前有說到MVC模式就是一種開發規範，AngularJS這個MVC框架帶給咱們的好處就是，他通過了Google不少項目的考驗，咱們使用AngularJS也能夠算是使用Google成熟的開發規範來進行項目開發。AngularJS這個MVC框架實際上聚集了太多太多Google的優秀理念和編程規範，這對於不少但願能統一開發規範的前端Team來講是很寶貴的。

---

感謝彬大神的指導和整理。關於我，僞全棧工程師。

---