漸進(jìn)式JavaScript框架

Vue.js是一套構(gòu)建用戶(hù)界面（UI）的漸進(jìn)式JavaScript框架。

1、庫(kù)和框架的區(qū)別？

• 庫(kù)：庫(kù)是提供給開(kāi)發(fā)者的一個(gè)封裝好的特定于某一方面的集合（方法和函數(shù)），庫(kù)沒(méi)有控制權(quán)，控制權(quán)還在使用者的手中：在庫(kù)中查詢(xún)自己需要的功能進(jìn)行應(yīng)用。
• 框架：框架即一臺(tái)架構(gòu)，是基于自身點(diǎn)為用戶(hù)提出的一套相對(duì)完整的問(wèn)題解決方案?？刂茩?quán)屬于框架本身，開(kāi)發(fā)者要根據(jù)框架的自身規(guī)范去進(jìn)行某些開(kāi)發(fā)。

2、漸進(jìn)式

漸進(jìn)式指沒(méi)有多做指責(zé)之外的事情。

VUE.js只提供了vue-cli生態(tài)中最核心的組件系統(tǒng)和雙向數(shù)據(jù)綁定，類(lèi)似vuex、vue-router都是屬于圍繞vue.js開(kāi)發(fā)的庫(kù)。

• 雙向數(shù)據(jù)綁定

將DOM和Vue示例的data數(shù)據(jù)綁定，彼此相互影響。

原理：Object.defineProperty中的get和set方法。

作用：指定讀取或設(shè)置對(duì)象屬性值的時(shí)候執(zhí)行操作。

• Angular：必須使用它的模塊機(jī)制，必須使用它的依賴(lài)注入，必須使用它的特殊形式定義組件。因此Angular具有較強(qiáng)的排他性，如果應(yīng)用不是從回頭開(kāi)始就不要考慮其他集成。
• React：函數(shù)式編程理念，副作用，純函數(shù)，如何隔離避免副作用。React的侵入性之所以看起來(lái)沒(méi)有Angular那么強(qiáng)主要因?yàn)樗菍儆谲浶郧秩搿?/li>
• Vue：漸進(jìn)的。（1）可以在原有的大系統(tǒng)上面把一兩個(gè)組件改用它去實(shí)現(xiàn)，即當(dāng)成jQuery來(lái)使用。（2）可以使用整個(gè)全家桶去開(kāi)發(fā)，即當(dāng)成Angular使用。（3）可以使用它的視圖，從而搭配我們自己設(shè)計(jì)的下層來(lái)使用。（4）可以在底層數(shù)據(jù)邏輯處用OO和設(shè)計(jì)模式的理念。（5）可以函數(shù)式，作為輕量視圖只做最核心的東西。

3、MVVM

• M：model數(shù)據(jù)模型
• V：View視圖
• VM：View Model視圖模型

（1）MVC和MVVM

MVC中將程序分為三大部分，實(shí)現(xiàn)了責(zé)任分離。在前端中需要經(jīng)常通過(guò)js代碼進(jìn)行邏輯操作，最終將邏輯操作的結(jié)果體現(xiàn)在頁(yè)面上，即頻繁的操作DOM。

MVVM通過(guò)數(shù)據(jù)雙向綁定來(lái)使得數(shù)據(jù)自動(dòng)地雙向同步，像VUE這種MVVM的框架就不建議去手動(dòng)操作DOM。

（2）VUE中的MVVM

1. VUE沒(méi)有完全遵循MVVM模型，在文檔中經(jīng)常使用vm的變量名表示VUE實(shí)例。
2. VUE思想：不要想著如何去操作DOM，而是如何操作數(shù)據(jù)。