MVVM和MVC分別是什么?有什么區(qū)別?使用場(chǎng)景是什么?

1.MVVM與MVC的定義

什么是MVVM?

MVVM即Model-View-ViewModel的簡(jiǎn)寫(xiě)，即模型-視圖-視圖模型，模型(Model)指的是后端傳遞的數(shù)據(jù)，視圖(View)指的是所看到的頁(yè)面，視圖模型(ViewModel)是mvvm模式的核心，它是連接view和model的橋梁。它有兩個(gè)方向：

一是將模型(Model)轉(zhuǎn)化成視圖(View)，即將后端傳遞的數(shù)據(jù)轉(zhuǎn)化成所看到的頁(yè)面，實(shí)現(xiàn)的方式是：數(shù)據(jù)綁定;

二是將視圖(View)轉(zhuǎn)化成模型(Model)，即將所看到的頁(yè)面轉(zhuǎn)化成后端的數(shù)據(jù)。實(shí)現(xiàn)的方式是：DOM事件監(jiān)聽(tīng)，這兩個(gè)方向都實(shí)現(xiàn)的，我們稱之為數(shù)據(jù)的雙向綁定。

什么是MVC?

MVC是Model-View-Controller的簡(jiǎn)寫(xiě)。即模型-視圖-控制器。M和V指的意思和MVVM中的M和V意思一樣。C即Controller指的是頁(yè)面業(yè)務(wù)邏輯，使用MVC的目的就是將M和V的代碼分離。MVC是單向通信。也就是View跟Model，必須通過(guò)Controller來(lái)承上啟下。

2.使用場(chǎng)景

主要就是MVC中Controller演變成MVVM中的viewModel，MVVM主要解決了MVC中大量的DOM操作使頁(yè)面渲染性能降低，加載速度變慢，影響用戶體驗(yàn)，vue數(shù)據(jù)驅(qū)動(dòng)，通過(guò)數(shù)據(jù)來(lái)顯示視圖層而不是節(jié)點(diǎn)操作，

場(chǎng)景：數(shù)據(jù)操作比較多的場(chǎng)景，需要大量操作DOM元素時(shí)，采用MVVM的開(kāi)發(fā)方式，會(huì)更加便捷，讓開(kāi)發(fā)者更多的精力放在數(shù)據(jù)的變化上，解放繁瑣的操作DOM元素。

3.MVC和MVVM的區(qū)別

MVC和MVVM其實(shí)區(qū)別并不大，都是一種設(shè)計(jì)思想， MVC和MVVM的區(qū)別并不是VM完全取代了C，只是在MVC的基礎(chǔ)上增加了一層VM，不過(guò)是弱化了C的概念，ViewModel存在目的在于抽離Controller中展示的業(yè)務(wù)邏輯，而不是替代Controller，其它視圖操作業(yè)務(wù)等還是應(yīng)該放在Controller中實(shí)現(xiàn)，也就是說(shuō)MVVM實(shí)現(xiàn)的是業(yè)務(wù)邏輯組件的重用，使開(kāi)發(fā)更高效，結(jié)構(gòu)更清晰，增加代碼的復(fù)用性。

猜你喜歡

JavaScript中l(wèi)et和var和const有什么區(qū)別?

v-show和v-if有什么區(qū)別？

什么是閉包函數(shù)?如何實(shí)現(xiàn)？

黑馬程序員HTML&JS+前端開(kāi)發(fā)課程