前言
如何定義庫與框架
前端的輔助工具太多太多了，那么我們是如何定義庫與框架？
- jQuery是目前用的最廣的庫了，但是整體來講jQuery目的性很也明確針對“DOM操作”，當然自己寫一個原生態方法也能實現同樣的DOM操作，換句話說，不管你用來還是不用，都不影響你整體的布局，或者是代碼體系結構。
- 框架則是一套完整的解決方案，針對是某一個領域的，比如EXT，dojo，那么很明顯，你要用就需要按照它的規則執行，不管是編碼風格還是結構，有一定的約束力
一個老話題，前端為什么要用MVC
- 前端開發中呢，不可避免的都有在應用邏輯中加入顯示數據的代碼的情況，當項目規模愈發變大時，這種形式的代碼變得越發的難以維護，因為任何在主干邏輯中的變更都可能影響到數據顯示邏輯，反之亦然，當然不管什么模式最主要的還是分離職責
- 可能在大多數后端開發者看來，整個前端就是一個View層罷了，還在在這個View層中划分模型，控制器等等，是不是很不屑？
- 在幾年前只做做網站的驗證之類的功能的話我或許會說，是的那是我也不信，但是隨着Web前端隨着復雜度的增加，很多地方跟客戶端已經沒有本質區別了。
- 如果是單純的頁面型的產品，確實不需要那么復雜，編程嘛復雜即是錯，針對不同項目我們應該就要明確不同的方案，就拿近幾年出現的Hybird App來說，這種應用軟件類產品，這就太需有良好的結構組織了，深有感觸的是我自己手上就是Hybird App這種項目，基本都是AMD+各種設計模式的組合
此MVC非比MVC
- MVC，模型 - 視圖 - 控制器這個沒哈好說的，基本概念大家都知道，PHP的zend,yii很多都是基於MVC的架構，但是這種的架構其實是把整個前端都都作為一個view處理了
- 所以如果單純拿Smalltalk-80的MVC的概念去套用前端，也就不那么合適了
我們如何理解前端的MVC
前端架構出現的根本原因呢，前端被越來越重視，nodejs,混合應用類似phonegap這都是在侵占別的領域 - -，所以前端功能的增強、代碼的膨脹，導致不得不做“前端的架構”這個事情了。
軟件架構模式MVC(Model-View-Controller)
大概理解就是：Models用來處理數據，View將處理結果呈現給用戶，Controller用來連接這兩者。
所以整個流程：
- 用戶在View上進行操作——比如在文本框輸入數值或是點擊按鈕
- Controller處理這個動作
- Controller通過Model對數據進行增刪改查，將其傳遞到View
- View將數據展示給用戶
大多數的前端jser感受不到MVC的重要性，最大的問題還是跟傳統的觀念有差別，模型不夠復雜，不存在控制器的概念
當然直接說前端MVC還是有點牽強的，模型不是真正的模型，在操作View的過程中一些輔助的模型，真正的Model是貫穿前后端的
歸根結底，我也不需要太深入的去討論各種不同，但是前端MVC框架的出現帶來的是一整套工作流程變更，后端工程師也可以編寫前端的模型代碼，把它跟后端徹底打通，交互工程師處理UI跟模型的互動關系，UI工作人員可以專注、無障礙地處理HTML源碼，把它們以界面模版的形式提供給交互工程師。這一整套協作機制能夠大大提高B/S架構系統的開發效率，如果再有外圍的管控平台，生產效率將真正踏進工業化的階段。
backbone
backbone是什么？
Backbone.js 是一個在JavaScript環境下的 模型-視圖-控制器 (MVC) 框架。任何接觸較大規模項目的開發人員一定會苦惱於各種瑣碎的事件回調邏輯、以及金字塔般的代碼。而且，在傳統的Web應用程序代碼中，不可避免的都有在應用邏輯中加入顯示數據的代碼的情況。當項目規模愈發變大時，這種形式的代碼變得越發的難以維護，因為任何在主干邏輯中的變更都可能影響到數據顯示邏輯，反之亦然。
Backbone就是要來解決這樣的代碼耦合的問題。它通過提供一個控制層-顯示層的框架，以及模版(template)來分離各自邏輯。這樣的MVC框架類似於傳統意義上桌面程序以及服務器端程序的程序框架。
這里只提backbone，至於什么mvp,mvvc模式，Angular,Ember,CanJs,我也研究不是很深入，就不誤人子弟了
模型、視圖、集合和路由器是 Backbone 框架中的主要組件
在backbone框架中，我們看不到控制器這個東東，在0.5版本之前好像是叫控制器，后來改成路由器了
可見backbone雖然號稱MVC，但是也非正統啊
總的理解
模型Models進行數據處理，創建驗證銷毀或者保存到服務器
合集Collections用來枚舉
通過Views來進行事件處理及與現有的Application通過RESTful JSON接口進行交互
backbone基本概念很容易理解，但是它並不會告訴你如何去架構一個應用，而僅僅只是在代碼的邏輯組織上提供一種方案
所以正真把backbone用好，個人感覺難度還是比其余的一些框架要大很多
而且還有個最大的問題，結構冗余，Backbone要求你寫很多樣板代碼，而這種代碼其實很多時候是完全沒必要的
好處自然就是靈活，社區大，插件多了
官方todos
http://backbonejs.org/examples/todos/index.html
這是個很經典的案例
先看todos需要實現的功能
1 添加任務
2 修改任務
3 刪除任務
4 任務統計
這個是完全用backbone實現的，其實整體一看邏輯還是很清晰的
Model，Collection，View，View
backbone的實現
先來分解下todos的操作，通過用戶輸入信息，然后顯示信息到頁面，然后還可以刪除修改
視圖View寓意就很明確，展現內容，內容從哪里來的，模型里面取的，模型為什么會有數據，因為用戶輸入的，怎么知道用戶輸入，因為監聽了
我們看看backbone的做法
首先是創建一個全局的Todo的collection對象
var Todos = new TodoList;
在視圖層對用戶行為的監控，從而對模型合集進行curd的一系列操作
Backbone.View.extend = { events: { "keypress #new-todo": "createOnEnter", "click #clear-completed": "clearCompleted", "click #toggle-all": "toggleAllComplete" }, createOnEnter: function (e) { if (e.keyCode != 13) return; if (!this.input.val()) return; Todos.create({title: this.input.val()}); this.input.val(''); } }
如果按照MVC的最原始定義，view永遠不會知道用戶輸入，比如鼠標操作和按鍵，所以這里很明顯就違規了~~
所以在web開發中，我們是無法1：1的對應入座的，用戶的輸入必須通過監聽窗口、文檔和元素上的事件來獲得
這里有個很MVC架構很不明確的點，控制器在哪里？Controller應該是View操作Model的中介？
所以backbone其實只能是看作為數據和邏輯相互分離的一種方案，減少代碼開發過程中的數據和邏輯混亂
好吧個人見解~ 不喜勿噴~
附上：