Vue-响应式原理

Vue 3 中 Ref 实现原理解析 在 Vue 3 中，ref 是组合式 API（Composition API）的核心。很多开发者虽然会用，但对其内部运作机制、ref 与 reactive 的关系

1. 数组 includes 方法在响应式系统中存在的问题 通过前文# Vue响应式原理(10)-数组的索引和length的介绍我们意识到，数组的方法内部其实都依赖了对象的基本语义。所以大多数情况下，

数组的可以通过 for...of 形式遍历元素，同样数组作为对象也可以用 for...in 形式来遍历 key 值。那么如果我们在副作用函数中对数组进行遍历，该如何进行依赖收集和依赖触发呢？ 1. f

在之前的文章中，我们的响应式对象都是普通的对象形式，这本文中将要介绍对数组的代理。在 JavaScript 中数组其实就是一种特殊的对象，因此我们需要了解数组与普通对象到底存在什么区别。 其实主要区别

在前面的文章中，我们重点对副作用注册函数 effect、依赖收集函数 track 和依赖触发函数 trigger 做了原理解释和代码编写。而对于响应式对象的代理，我们还未做深入的探讨和了解。截至目前，

1. watch侦听器 Vue 中的侦听器 watch 主要功能是对响应式数据进行观测，当数据发生变化时，会将响应式数据的旧值和新值作为参数传递给用户提供的回调函数并执行。实际上，watch 的实现就

在前文《Vue响应式原理(6)-调度器实现》中，我们实现了调度器。在先前实现的响应式系统基础上加上调度器的能力，我们就能尝试实现Vue中一项重要能力--计算属性。 1. 计算属性的懒执行实现 说到计算

1. 可调度性 可调度性指的是当 trigger 动作触发副作用函数重新执行时，有能力决定副作用函数执行的时机、次数以及方式。 在副作用函数中打印 obj.foo，完成了依赖收集过程。随后对 obj.

1. 无限递归循环问题 在# Vue响应式原理(4)-无限循环和effect嵌套问题解决一文中，我们对响应式系统存在的两个问题进行了解决，到目前为止我们实现的响应式系统已经能提供相对较为完善的功能，但

1. 无限循环问题解决 在前文《Vue响应式原理(3)-断开副作用函数与响应式数据联系》最后，我们会发现改进后的响应式系统会导致死循环的产生。问题主要产生在 trigger 代码中： 在 trigge

1. 分支切换过程中的问题 基于先前编写的响应式系统，我们来考虑一种分支切换的情况如下： 在 effectFn 函数中的三元表达式会根据字段obj的status属性值变化会执行不同的代码分支。 当ob

1. 副作用函数注册 在上节中，简易实现了一个响应式系统，这种实现方式存在很多问题需要解决。 首先，对于副作用函数的收集，我们通过将变量名硬编码为effect来实现。这种硬编码方式存在很大局限，当我们

1.副作用函数和响应式数据 副作用函数指的是会产生副作用的函数。例如当函数执行时会设置body的文本内容，除了该副作用函数之外的任何函数都可以读取或设置body的文本内容。表明该副作用函数的执行会直接