前端面試 vue 部分 (1)——談談你對 MVVM 的理解


file

談談你對MVVM的理解

【答案】

MVVM 由 Model、View、ViewModel 三部分構成

  • Model 代表數據模型,也可以在 Model 中定義數據修改和業務邏輯;
  • View 代表 UI 組件,它負責將數據模型轉化成 UI 展現出來;
  • ViewModel 是一個同步View 和 Model的對象;

圖片

[擴展問題]:為什么會出來MVVM

當業務程度越來越復雜時,MVC暴露出了很多問題,而MVVM就是為了解決這些問題出現的

當前端發展起來后,這時前端開發就暴露出了三個痛點問題:

  • 開發者在代碼中大量調用相同的 DOM API, 處理繁瑣 ,操作冗余,使得代碼難以維護。
  • 大量的DOM 操作使頁面渲染性能降低,加載速度變慢,影響用戶體驗。
  • 當 Model 頻繁發生變化,開發者需要主動更新到View ;當用戶的操作導致 Model 發生變化,開發者同樣需要將變化的數據同步到Model 中,這樣的工作不僅繁瑣,而且很難維護復雜多變的數據狀態。

其實,早期 jquery 的出現就是為了前端能更簡潔的操作 DOM 而設計的,但它只解決了第一個問題,另外兩個問題始終伴隨着前端一直存在。 MVVM 的出現,完美解決 了 以上三個問題 。

[擴展問題]:什么是MVC

  1. MVCModel-View-Controller 的縮寫,即 模型—視圖—控制器
  • Model:后端傳遞的 數據
  • View:所看到的 頁面
  • Controller:頁面 業務邏輯
  1. MVC是 單向通信 。即View和Model,必須通過Controller來承上啟下。

  2. 使用MVC的 目的 就是 將M和V的代碼分離

[擴展問題]:MVC和MVVM的關系

MVVM是將之前的MVC后端開發:

  • M:model數據庫中的數據
  • V:view前端頁面
  • C:controller后端控制器

中的V即View分成了MVVM模式

MVVM模式:不需要用戶手動的操作dom的,主要是實現數據雙向綁定

[擴展問題]:VUE和MVVM的關系

Vue.js 可以說是MVVM 架構的最佳實踐,VUE並沒有完全遵循MVVM,專注於 MVVM 中的 ViewModel,不僅做到了數據雙向綁定,而且也是一款相對比較輕量級的JS 庫,API 簡潔,很容易上手
歡迎留言~~~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM