vue-响应式原理[通俗易懂]

vue-响应式原理[通俗易懂]1.vue响应式原理核心使用的API是:Object.defineProperty(obj,key,val)会对props和data、computed中的数组和对象都进行一个遍历,这个过程其实就是赋予数据set和get方法,让数据的访问和赋值有一些内部处理2.由于vue的核心使用的是Object.defineProperty,但是IE8及其以下版本是不兼容这个API的,并且也没有提供相关的API支持这个功能,因此这也是为什么vue项目不兼容的根本原因3.在对数组和对象进行操作的过程中,会对对象进行一个

大家好,又见面了,我是你们的朋友全栈君。

1.vue响应式原理核心使用的API是:Object.defineProperty(obj,key,val)
会对props和data、computed中的数组和对象都进行一个遍历,这个过程其实就是赋予数据set和get方法,让数据的访问和赋值有一些内部处理

2.由于vue的核心使用的是Object.defineProperty,但是IE8及其以下版本是不兼容这个API的,并且也没有提供相关的API支持这个功能,因此这也是为什么vue项目不兼容的根本原因

3.在对数组和对象进行操作的过程中,会对对象进行一个递归,因为对象中属性的值有可能还是一个对象,vue将数组和对象设置访问器属性分开做了两个方法进行的处理

4.源码中observe方法是递归的去执行检查是否是一个对象,是对象就递归,确保里面的每一个属性都得到了响应式的初始化

5.defineReactive方法就是具体的一个Object.defineProperty()的一个vue的封装了,也就是在这里进行的响应式的关键代码

6.所谓的自动化其实就是在get和set里面去做文章

7.其中get做的事情其实就是依赖收集:就是订阅数据变化的watcher的收集,这样在set的时候就会做一些更新这些watcher的操作,也就清楚的知道了在触发setter的时候,能知道应该通知哪些watcher去进行渲染

8.set()中发生的就是派发更新了,也就是对get()收集的依赖,进行精准更新的一个过程。当数据发生改变后,通知所有订阅了这个数据变化的watcher执行update

9.为什么我们给对象添加新属性的时候需要$set去设置,但是我们对数组的一些操作却能够直接更新。是因为vue重写了一些数组原型上的方法:push、pop、shift、unshift、splice、sort、reverse

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/132323.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Eclipse中安装&使用SVN

    Eclipse中安装&使用SVNEclipse中安装&使用SVN

    2022年4月24日
    43
  • 一文带你搞清楚USB、type-C、雷电三接口之间的区别与联系

    一文带你搞清楚USB、type-C、雷电三接口之间的区别与联系缘起随着小新pro发布,看到带了全功能的type-c接口,一直搞不懂什么type-c还有什么全功能,半功能?和雷电3又有什么区别,雷电3又有什么全速,半速。由于搞不清,所以网上看了很多资料,这里总结一下以备后续查阅说说usb3.1和雷电3usb接口大家再熟悉不过了,就是我们经常说的这种的但其实这个样子的全称是USBType-A,除此之外还有USBType-B,USBType-C…

    2022年6月16日
    68
  • 硬盘显示文件系统RAW要如何办啊

    硬盘显示文件系统RAW要如何办啊F盘打不开文件系统RAW,是因为这个I盘的文件系统内部结构损坏导致的。要恢复里面的数据就必须要注意,这个盘不能格式化,否则数据会进一步损坏。具体的恢复方法看正文

    2022年8月5日
    4
  • spss分析方法聚类分析_变量聚类分析

    spss分析方法聚类分析_变量聚类分析聚类分析是根据研究对象的特征,按照一定标准对研究对象进行分类的一种分析方法。下面我们主要从下面四个方面来解说:一、实际应用聚类分析的目标就是在相似的基础上收集数据来分类。聚类源于很多领域,包括数学,计算机科学,统计学,生物学和经济学。在不同的应用领域,很多聚类技术都得到了发展,这些技术方法被用作描述数据,衡量不同数据源间的相似性,以及把数据源分类到不同的簇中。商业上:聚类分析被用来发现不同的客户群,并且通过购买模式刻画不同的客户群的特征。聚类分析是细分市场的有效工具,同时也可用于研究消费者行为

    2022年10月18日
    3
  • 注会综合记忆锦囊:手绘PEST模型,记忆可以这样玩「建议收藏」

    注会综合记忆锦囊:手绘PEST模型,记忆可以这样玩「建议收藏」【】综合的记忆量非常庞大,且看小萌有妙招,通过“关键词”和“手绘图”带你一起巧记忆。一、PEST宏观环境分析:4项1.政治因素:4项(1)执政党所持的态度和推行的基本政策(2)企业所在国家和地区的政局稳定状况(3)政府行为对企业的影响(4)各政治利益集团对企业活动产生的影响2.法律环境因素:4项(1)国家司法机关和执法机关(2)国际法所规定的国际法律环境和目标国

    2022年5月23日
    36
  • 用WriteProcessMemory做进程注入 (非DLL注入)

    用WriteProcessMemory做进程注入 (非DLL注入)今天要完成一个项内容,运行另一个应用程序abc.exe,实现它的父进程是explorer.exe。最开始的思路是获得explorer.exe的句柄,用ShellExecute启动abc.exe。但是用explorer.exe的句柄创建的进程的父进程依然是调用和进程,而不是传入句柄的进程。看来直接的不行,只能用间接的了。把运行abc.exe的代码段写到explorer.exe的内存里面去。然后让explorer来运行这段代码。static DWORD CALLBACK ThreadProc()…{    

    2025年9月1日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号