什么是MVC？

MVC思想：Controller負責將Model的數據用View顯示出來。

Model:處理數據邏輯的部分，負責在數據庫中存儲數據。

View:處理數據的顯示部分

Controller:是應用程序的交互部分，通常控制器負責從視圖中讀取數據，控制用戶輸入，并向模型發送數據。

Controller是MVC中數據和視圖的協調者，也就是Controller里面把Model的數據賦值給view來實現，或者是View接收用戶輸入的數據然后由Controller把這些數據傳給Model來保存到本地或者上傳到服務器。

通信流程：

（1）View接收用戶傳入的數據，傳送指令到Controller

（2）Controller完成業務邏輯后，要求Model改變狀態

（3）Model將新的數據發送到View，用戶得到反饋

所有通信都是單向的。

在MVC中，view是可以直接訪問model的，從而view里會包含model的信息， 不可避免的還要包含一些業務邏輯。MVC關注的是Model的不變，所以在MVC模型中，Model不依賴于View，但是View是依賴于Model的。不僅如此，因為有一些業務邏輯在View里實現了，導致要更新View也是比較困難的，至少業務邏輯是無法重用的。

?

什么是MVVM？MVVM是Model-View-ViewModel的縮寫。

MVVM最早由微軟提出來，它借鑒了桌面應用程序的MVC思想，在前端頁面中，把Model用純JavaScript對象表示，View負責顯示，兩者做到了最大限度的分離。

MVVM是將其中view的狀態和行為抽象化，讓我們將視圖UI和業務邏輯分開，當然這些事viewModel已經幫我們做了，它可以取出model的數據同時幫忙處理view中由于需要展示內容而涉及的業務邏輯。

它采用雙向綁定：View的變動自動反映在ViewModel，反之亦然。

把Model和View關聯起來的就是ViewModel。ViewModel負責把Model的數據同步到View顯示出來，還負責把View的修改同步回Model。

一個MVVM框架和jQuery操作DOM相比有什么區別？

我們先看用jQuery實現的修改兩個DOM節點的例子：

<!-- HTML --> <p>Hello, <span id="name">Bart</span>!</p> <p>You are <span id="age">12</span>.</p>

Hello, Bart!

You are 12.

用jQuery修改name和age節點的內容：

var name = 'Homer';
var age = 51;

$('#name').text(name);
$('#age').text(age);

如果我們使用MVVM框架來實現同樣的功能，我們首先并不關心DOM的結構，而是關心數據如何存儲。最簡單的數據存儲方式是使用JavaScript對象：

var person = {name: 'Bart',age: 12 };

我們把變量person看作Model，把HTML某些DOM節點看作View，并假定它們之間被關聯起來了。

要把顯示的name從Bart改為Homer，把顯示的age從12改為51，我們并不操作DOM，而是直接修改JavaScript對象：

person.name = 'Homer';
person.age = 51;

執行上面的代碼，我們驚訝地發現，改變JavaScript對象的狀態，會導致DOM結構作出對應的變化！這讓我們的關注點從如何操作DOM變成了如何更新JavaScript對象的狀態，而操作JavaScript對象比DOM簡單多了！

這就是MVVM的設計思想：關注Model的變化，讓MVVM框架去自動更新DOM的狀態，從而把開發者從操作DOM的繁瑣步驟中解脫出來！

轉載于:https://www.cnblogs.com/xiaoan0705/p/8939669.html

總結

以上是生活随笔為你收集整理的MVC与MVVM框架的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。