1、MVC設計模式
MVC是一種設計模式，它將應用划分為3個部分：數據（模型）、展現層（視圖）和用戶交互（控制器）。換句話說，一個事件的發生是這樣的過程：
（1）用戶和應用產生交互。
（2）控制器的事件處理器被觸發。
（3）控制器從模型中請求數據，並將其交給視圖。
（4）視圖將數據呈現給用戶。
V層是視圖層，控制界面顯示，將界面與數據連接。M層存放數據，處理邏輯，比如處理從數據庫調用的數據，還有業務邏輯處理。C層用於連接M和V，Controller 負責顯示界面、響應用戶的操作以及與 Model 交互，比如操作DOM、對事件的監聽。這就導致了Controller和 View 緊耦合、邏輯復雜，難以維護。
2、MVVM設計模式
MVVM與MVC最大的區別就是：它實現了View和Model的自動同步，也就是當Model的屬性改變時，我們不用再自己手動操作Dom元素，來改變View的顯示，而是改變屬性后該屬性對應View層顯示會自動改變。
由此和view層分開來，只是注重數據的改動即可。MVVM設計模式中最重要的就是實現了View和Model的自動同步，所以可以不用頻繁地手動操作DOM元素。
比如說Vue框架，Vue實例中的data相當於Model層，而ViewModel層的核心是Vue中的雙向數據綁定，即Model變化時VIew可以實時更新，View變化也能讓Model發生變化。 整體看來，MVVM比MVC精簡很多，不僅簡化了業務與界面的依賴，還解決了數據頻繁更新的問題，不用再用選擇器操作DOM元素。
3、事件驅動
JS是事件驅動的編程語言。業務邏輯主要是靠Dom元素上的事件綁定來驅動。
事件是業務邏輯的推動者也是與對象交互的入口。每個事件都會有一個event對象，對象里面包含了各種你所想得到的信息。
4、數據驅動
數據驅動的意思就是由數據來驅動業務邏輯，重點關注數據的變動，當數據發生發生改變時，DOM元素也會隨之發生變化。
數據驅動的前提是事先將DOM與數據綁定，像vue這種就是將一個vue對象與一個DOM節點模板關聯起來，這個DOM節點里所有子節點、所有節點屬性，全都可以和vue對象中的data綁定，做到data中某個屬性值變化時，相應DOM節點中對應的某個屬性就變化。
如此一來，關注點完全分離。分開設計頁面DOM結構和數據結構，然后將DOM與數據結構做關聯，之后所有的事件觸發的都只是數據的變化，DOM會自動根據數據的變化做相應改變。