mvvm簡(jiǎn)介
mvvm是 Model(模型) View（視圖） ViewModel（視圖模型） 的簡(jiǎn)稱。這就是頁(yè)面渲染和數(shù)據(jù)交互的全部?jī)?nèi)容。下面看圖說(shuō)話：
1、View也就是視圖，也就是dom ；
2、Model也就是模型，簡(jiǎn)單理解成JavaScript相關(guān)數(shù)據(jù)；
3、ViewModel也就是視圖模型，也就可以理解成溝通view已經(jīng)model的橋梁（這不是廢話么）；
何謂橋梁？
1.當(dāng)用戶進(jìn)行dom操作時(shí)view就會(huì)告訴vm，然后vm會(huì)根據(jù)自定義的相關(guān)操作然后告訴model說(shuō)下那個(gè)變量x給這么動(dòng)一下。
2.當(dāng)model發(fā)生改變時(shí)model就會(huì)告訴vm這個(gè)數(shù)據(jù)變了，然后vm根據(jù)自定義相關(guān)操作通知view這個(gè)dom節(jié)點(diǎn)需要改變。
3.vm充當(dāng)?shù)氖且粋€(gè)觀察者的角色，時(shí)刻關(guān)注著view/model的變化。
為什么要用mvvm
1、簡(jiǎn)化復(fù)雜邏輯數(shù)據(jù)交互
舉個(gè)栗子：在使用原生js或者jq中數(shù)據(jù)發(fā)生變化，首先需要通過(guò)選擇器找到相關(guān)dom節(jié)點(diǎn)，然后進(jìn)行操作例如element的顯隱、dom增減、類的添加等等，在mvvm中，只需要采用適當(dāng)?shù)闹噶?，綁定相關(guān)變量即可操作，免去諸多邏輯上的煩惱。
2、實(shí)現(xiàn)單頁(yè)頁(yè)面
為毛要單頁(yè)呢？以往項(xiàng)目中請(qǐng)求新的頁(yè)面都要通過(guò)頁(yè)面刷新，都需要全部請(qǐng)求新的資源。雖然資源可以通過(guò)緩存機(jī)制進(jìn)行優(yōu)化，但是新頁(yè)面的加載js,css,html文件全都要被瀏覽器重新解析，造成資源的浪費(fèi)，尤其是對(duì)移動(dòng)端十分不友好。通過(guò)單頁(yè)應(yīng)用的異步請(qǐng)求局部刷新這一特性，解決了這一個(gè)問(wèn)題。（同樣要說(shuō)的是，spa單頁(yè)對(duì)seo的打擊也是毀滅性的。）
ps:參考視頻：慕課網(wǎng)餓了么實(shí)戰(zhàn)；
