javascript - 什么是基于数据驱动的前端框架？

问题描述

问 题

经常看到介绍 Angular,Vue的介绍是数据驱动的前端框架，那到底什么是数据驱动呢？相对于数据驱动，还有什么驱动类型呢？希望大家不吝赐教。

解决方案

强答一波，说说我的理解，希望对你有帮助。

---

首先，数据驱动 是一种编程范式(Programming Paradigm)，相似的有很多，详情可以参考这里：https://en.wikipedia.org/wiki...

---

如果只谈前端，那么问题就会简化很多，一般来说，会比较 数据驱动 与 事件驱动。数据驱动思想的出现一定程度上弥补了事件驱动的不足。

先说事件驱动，一个很典型的例子就是 jQuery。用 jQuery 开发的页面执行初期就像这样：

通过特定的选择器查找到需要操作的节点 -> 给节点添加相应的事件监听

响应用户操作，效果是这样：

用户执行某事件（点击，输入，后退等等） -> 调用 JavaScript 来修改节点

这种模式，对于业务需求简单的页面来说没什么问题。只是现在前端越来越复杂，光用这样的模式已经满足不了很多大型项目的需求。另一方面，找节点和修改节点这件事儿，效率本身就很低。因此出现了数据驱动模式，我们就拿其中的一种，MVVM 来举例子，执行初期就像这样：

读取模板，同时获得数据，并建立 VM(view-model) 的抽象层 -> 在页面进行填充

要注意的是，MVVM 对应了三个层，M - Model，可以简单的理解为数据层；V - View，可以理解为视图，或者网页界面；VM - ViewModel，一个抽象层，简单来说可以认为是 V 层中抽象出的数据对象，并且可以与 V 和 M 双向互动（一般实现是基于双向绑定，双向绑定的处理方式在不同框架中不尽相同）。
针对用户的操作，大致是这样：

用户执行某个操作 -> 反馈到 VM 处理（可以导致 Model 变动） -> VM 层改变，通过绑定关系直接更新页面对应位置的数据

总结一下，可以简单的这么去理解：数据驱动不是操作节点的，而是通过虚拟的抽象数据层来直接更新页面。我觉得，主要就是因为这一点，数据驱动框架才得以有较快的运行速度（因为不需要去折腾节点），并且可以应用到大型项目。

这篇关于javascript - 什么是基于数据驱动的前端框架？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！