三个非常重要的架构模式
MVC 是一个架构设计模式,它通过分离关注点的方式来支持改进应用组织方式。它促成了业务数据(Models)从用户界面(Views)中分离出来,还有第三个组成部分(Controllers)负责管理传统意义上的业务逻辑和用户输入。
Models 管理一个业务应的数据。它们既与用户界面无关也与表现层无关,相反的它们代表了一个业务应用所需要的形式唯一的数据。当一个 model 改变时(比如当它被更新时),它通常会通知它的观察者(比如我们很快会介绍的 views)一个改变已经发生了,以便观察者采取相应的反应。
视图是模型的可视化表示,提供了一个当前状态的经过过滤的视图。JavaScript 的视图是关于构建和操作 dom 元素的。
一个视图通常是模型的观察者,当模型改变的时候,视图得到通知,因此使得视图可以更新自身。
控制器是模型和视图之间的中介,典型的职责是当用户操作视图的时候同步更新模型。
模型-视图-展示器(MVP)是 MVC 设计模式的一个衍生模式,它专注于提升展现逻辑。
MVP 中的 P 代表展示器。它是一个包含视图的用户界面逻辑的组件。不像 MVC,来自视图的调用被委派给了控制器,它是从视图中解耦出来的,并且转而通过一个接口来同它进行对话。
在 MVP 中,P 观察着模型并且当模型发生改变的时候对视图进行更新(被动视图)。P 切实的将模型绑定到了视图,这一责任在 MVC 中被控制器提前持有了。
相较于 MVC 模式,MVP 的好处在于:
劣势在于:
MVVM(Model View ViewModel)是一种基于 MVC 和 MVP 的架构模式,它试图将用户界面(UI)从业务逻辑和行为中更加清晰地分离出来。为了这个目的,很多例子使用声明变量绑定来把 View 层的工作从其他层分离出来。
视图模型被认为是一个专门进行数据转换的控制器。它可以把对象信息转换到视图信息,将命令从视图携带到对象。
视图模型位于我们 UI 层后面层。它通过视图发布对象的公共数据,同时它作为视图源提供数据和方法。
视图和视图模型使用数据绑定和事件进行通信。视图模型不仅仅发布对象属性,它还提供其他的方法和特性,诸如验证。
我们的视图处理自己的用户接口事件,并会把相关事件映射到视图模型。对象和它属性与视图模型是同步的,且通过双向数据绑定进行更新。
触发器(数据触发器)允许我们进一步在视图状态变化后改变我们的对象属性。
优点:
缺点:
Vue 中通过每个节点的 nodeType 属性是1还是3判断是元素节点还是文本节点,针对不同类型节点做不同的处理。DocumentFragment是一个可以被 js 操作但不会直接出发渲染的文档对象,Vue 中编译模板时是现将所有节点存到 DocumentFragment 中
那时计算机世界天地混沌,浑然一体,然后出现了一个创世者,将现实世界抽象出模型形成model,将人机交互从应用逻辑中分离形成view,然后就有了空气、水、鸡啊、蛋什么的。
MVVM 双向数据绑定 在Angular1.x版本的时候通过的是 脏值检测 来处理;而现在无论是React还是Vue还是最新的Angular,其实实现方式都更相近了,那就是通过 数据劫持+发布订阅模式
Model:根据APP文档,model包括数据和操作数据的业务逻辑。View:view通常是UIKit控件的集合,不能直接引用model,并且视图本身没有任何业务逻辑。Controller:controller协调model和view之间的所有交互。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!