博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浅析MVC、MVP、MVVM 三种开发模式以及Vue双向数据绑定原理
阅读量:5825 次
发布时间:2019-06-18

本文共 1061 字,大约阅读时间需要 3 分钟。

MVC

M:model V:view C:controller

MVC 是不改变试图的情况下改变试图对用户输入的相应方式Model 层用于封装和应用程序的业务逻辑相关的数据以及对数据的处理方法View 作为视图层,主要负责数据的展示Controller 让它来定义用户界面对用户输入的响应方式,它连接模型和视图,用于控制应用程序的流程,处理用户的行为和数据上的改变用户对V的操作交给了C处理,在C中相应V的事件调用M的接口对数据进行操作一旦M发生变化便通知相关试图进行更新!

MVP

MVP中的V不直接使用M,而是通过为P提供接口,让P去更新M,再通过观察者模式更新V。M => Model管理数据 V => View负责显示 P => Presenter 负责业务逻辑 与MVC相比,MVP模式通过解耦View和Model,完全分离视图和模型使职责划分更加清晰;由于View不依赖Model,可以将View抽离出来做成组件,它只需要提供一系列接口提供给上层操作

MVVM

MVVM(Model-View-ViewModel)最早由微软提出。ViewModel指 "Model of View"——视图的模型在MVVM中,我们可以把Model称为数据层,因为它仅仅关注数据本身,不关心任何行为,格式化数据由View的负责VM实现数据双向绑定当Model发生变化,ViewModel就会自动更新;ViewModel变化,Model也会更新。

双向数据绑定原理——Vue

Vue 采用 数据劫持 和 发布-订阅模式的方式,通过ES5提供的Object.defineProperty()方法来劫持(因为ie8以下不支持该方法,所以vue不兼容ie8)各属性的getter、setter,并在数据(对象)发生变动时通知订阅者,出发相应的监听回调。由于,是在不同数据上出发同步,可以精确的将变更发送给绑定的试图,而不是对所有的数据都执行一次检测,要实现Vue中的双向数据绑定,大致可以划分三个模块:Observer、Compile、WatcherObserver 数据监听器负责对数据对象的所有属性进行监听(数据劫持),监听到数据发生变化后通知订阅者。Compiler 指令解析器扫描模板,并对指令进行解析,然后绑定指定事件。Watcher 订阅者关联Observer和Compile,能够订阅并收到属性变动的通知,执行指令绑定的相应操作,更新视图。Update()是它自身的一个方法,用于执行Compile中绑定的回调,更新视图。

转载地址:http://eosdx.baihongyu.com/

你可能感兴趣的文章
数据结构-时间复杂度
查看>>
对象与字符串相互转换
查看>>
[NOIp2017提高组]小凯的疑惑
查看>>
《C程序设计语言》练习1-5
查看>>
$\frac{dy}{dx}$ 是什么意思?
查看>>
Go开发之路(目录)
查看>>
RHEL6.5安装成功ORACLE11GR2之后,编写PROC程序出错解决方法
查看>>
(50)与magento集成
查看>>
Ubuntu设置python3为默认版本
查看>>
JsonCpp 的使用
查看>>
问题账户需求分析
查看>>
JavaSE-代码块
查看>>
爬取所有校园新闻
查看>>
32、SpringBoot-整合Dubbo
查看>>
python面向对象基础
查看>>
HDU 2044 一只小蜜蜂(递归)
查看>>
docker 下 安装rancher 笔记
查看>>
spring两大核心对象IOC和AOP(新手理解)
查看>>
数据分析相关
查看>>
Python LDAP中的时间戳转换为Linux下时间
查看>>