首页 » Web前端 » phpmvcmvpmvvm技巧_轨范员应该知道的MVCMVPMVVM设计模式差异及优缺点

phpmvcmvpmvvm技巧_轨范员应该知道的MVCMVPMVVM设计模式差异及优缺点

访客 2024-11-24 0

扫一扫用手机浏览

文章目录 [+]

WPF(Windows Presentation Foundation – 微软推出的基于Windows 的用户界面框架)

标准MVVM

phpmvcmvpmvvm技巧_轨范员应该知道的MVCMVPMVVM设计模式差异及优缺点

作为 Martin Fowler 在 2004 年提出的观点,Presentation Model 到本日实在也是非常前辈的,PM 模式将视图中的全部状态和行为放到一个单独的展示模型中,折衷领域工具(模型)并且为视图层供应一个接口。
在监督掌握器(Controller)中,视图层与模型层中的一些大略属性进行绑定,在模型属性变革时直接更新视图(耦合),而 PM 通过引入展示模型将模型层中的数据与繁芜的业务逻辑封装成属性与大略的数据同时暴露给视图,让视图和展示模型中的属性进行同步。
这样看起来彷佛与MVP差别不大,但两者最大的差异就在于视图和展示模型之间状态的同步,即数据双向绑定。
这里通过Vue中的一个小例子就能明白:

phpmvcmvpmvvm技巧_轨范员应该知道的MVCMVPMVVM设计模式差异及优缺点
(图片来自网络侵删)
<!DOCTYPE html><html lang=\"大众en\"大众><head> <meta charset=\公众UTF-8\公众> <title>Document</title> <script type=\"大众text/javascript\公众 src=\公众../vue.js\公众></script> <script type=\公众text/javascript\"大众 src=\公众../jquery-3.3.1.min.js\"大众></script></head><body> <div id=\"大众app\公众> <input type=\"大众text\"大众 v-model=\"大众inputValue\公众> <button v-on:click=\"大众handleClickon\"大众>点击提交</button> <ul> <li v-for=\"大众item in list\"大众>{{item}}</li> </ul> </div> <script> var app = new Vue({ el: '#app', data: { list: [], inputValue: '' }, methods: { handleClickon: function() { this.list.push(this.inputValue); this.inputValue = ''; } } }) </script></body></html>

可以看到当我们在掌握台(可以算作VM)处理数据时,可以立即更新到视图上(V),而在视图上输入时(V),也可以在掌握台同步看到(VM),这便是双向数据绑定,也是MVVM与MVP的差异之处。

MVVM优点:

MVVM模式和MVC模式类似,紧张目的是分离视图(View)和模型(Model),有几大优点:

低耦合,视图(View)可以独立于Model变革和修正,一个ViewModel可以绑定到不同的”View”上,当View变革的时候Model可以不变,当Model变革的时候View也可以不变。
可重用性,可以把一些视图逻辑放在一个ViewModel里面,让很多view重用这段视图逻辑。
独立开拓,开拓职员可以专注于业务逻辑和数据的开拓(ViewModel),设计职员可以专注于页面设计,利用Expression Blend可以很随意马虎设计界面并天生xml代码。
可测试,界面向来是比较难于测试的,而现在测试可以针对ViewModel来写。

总结:

从 MVC 架构模式到 MVVM,从分离展示层到展示模型层,经由几十年的发展和演化,MVC 架构模式涌现了各种各样的变种,并在不同的平台上有着自己的实现。

在架构模式的选用时,我们每每没有太多的发言权,紧张由于平台本身每每对运用层有着自己的设计,我们在开拓客户端或者前端运用时,只须要遵照平台固有的设计就可以完成运用的开拓;不过,在有些时候,由于工程变得弘大、业务逻辑变得非常繁芜,我们也可以考虑在原有的架构之上实现一个新的架构以知足工程上的须要。

各种架构模式的浸染便是分离关注,将属于不同模块的功能分散到得当的位置中,同时只管即便降落各个模块的相互依赖并且减少须要联系的胶水代码。
文中对付 MVC、MVP 和 MVVM 架构模式的描述很难不掺杂作者的主不雅观见地,如果对文章中的内容有疑问,欢迎提出不同的见地进行谈论。

标签:

相关文章