前端框架與類庫

一直不能分別前端框架和類庫（我這個前端也是假的吧？），結合各位前輩的思想，整理了一下：

前端框架與前端類庫的區別

使用框架前，我以爲很重要的一點是弄清類庫（諸如JQuery）和框架（諸如angularJS)的區別在何處。

簡單而言，類庫，解決的是代碼或者是模塊級別的複用或者對複雜度的封裝問題，例如將一個解決複雜問題的功能模塊封裝成一個函數，提供一個簡單的接口。庫它是一種工具，它提供了不少封裝好的方法，用與不用取決於咱們自身，即便用了也不會影響咱們呢的代碼結構。

而框架，更多的是對模式級別的複用和對程序組織的規範。這裏的模式是指好比MVC，爲了實現M和V的解耦，把複雜的耦合關係由常常變化的業務代碼轉移到不常常變化的框架內部消化。是面向一個領域來提供一套解決方案，提升開發效率，若是咱們選擇了使用某框架，就應該遵循該框架所規定的規則。

兩者最主要的區別是：JQuery以DOM操做爲中心，框架，準確來講是MVC框架，是以模型（model）爲中心，而DOM操做是附加的。因此，以模型爲中心最終達到的目的是帶來一整套工做流程的變動，使得後臺工程師能夠編寫前端的模型代碼，把後臺與前端打通，交互設計師處理UI跟模型的互動關係，UI設計師能夠專一、無障礙的處理HTML源碼，把它們以界面模板的形式提交給交互工程師。這一整套協做機制能大大提升開發效率。使用MVC框架使得前端任務更好的被解耦。

前端MVC框架思想

咱們知道，傳統的MVC模式將一個應用劃分爲——模型層（model）、視圖層（view）、控制層（controller）。他們在應用系統中擔當不一樣的角色，完成不一樣的任務。

• Model：即數據模型，用來包裝和應用程序的業務邏輯相關的數據或者對數據進行處理，模型能夠直接訪問數據。

• View：視圖用來有目的顯示數據，在視圖中通常沒有程序上的邏輯，爲了實現視圖上的最新功能，視圖須要訪問它監視的數據模型。

• Controller：控制器調控模型和視圖的聯繫，它控制應用程序的流程，處理事件並做出響應，事件不單單包括用戶的行爲還有數據模型上的改變。經過捕獲用戶事件，通知模型層做出相應的更新處理，同時將模型層的更新和改變通知給視圖，使得視圖做出相應改變。所以控制器保證了視圖和模型的一致性。

那麼在前端中的表現。前端MVC中各部分的職責：

我對前端的View的理解是，與頁面上元素直接相關的部分都屬於View。包括html，CSS和一部分直接控制頁面元素的JS。能夠從Model中獲得數據，並將其顯示到頁面上。而關於數據的變動與請求，則通通交給Controller處理。

那麼Controller呢？做爲Model和View的粘合劑，Controller將View方面的請求轉發給合適的Model，在必要時也會去更新View。而Controller自己也能夠做爲Model的觀察者，獲取Model的變動。而做爲Controller自己，就不該該有涉及到頁面元素的代碼了。

最後談談Model，與後端的溝通、AJAX請求以及對數據的處理都屬於Model的工做。Model自己不知道誰是View，誰是Controller。它只提供一些方法供View和Controller調用，而且將變動通知給它的觀察者View或Controller。顯然，Model與頁面元素之間也解耦了。

雖然基於MVC模型的框架之間也有不少不一樣之處，可是整體而言，Model負責保存vier須要的數據以及數據處理邏輯，例如讀寫，更新，刪除，驗證，轉換等。View負責接收並顯示Model提供的數據以及接收用戶的輸入，而且響應事件，Model更新後及時將更新反饋回用戶。Controller處理業務邏輯和事件邏輯。

 原文地址（https://www.cnblogs.com/coco1s/p/4040108.html）