我是日安

我一直都没有发出这最后一篇文章，主要是因为这也只是个心得总结，后续也没有了（哈哈） 在学习 Vue 3 的过程中，我很幸运能遇到远方的帮助。他是 Vue3 的核心成员，也是 vue-draggable

在开始 readonly 之前，我们先补充一下 Proxy 的知识： Proxy Proxy 是实现 reactive、readonly 等功能的核心。它会在目标对象前架设一个“代理”或“拦截层”，让

ref 与 reactive 都属于深层响应 (deep) API。它们会递归地将内部所有嵌套对象都转换为响应式代理。在多数情况下这非常方便，但当处理大型数据结构时，这种深度监听的性能开销可能会造成瓶

在响应式系统中，reactive 能够将一个对象转换为深层的响应式对象，但是在开发过程中，我们时常会需要用到解构赋值，这时候会导致响应性丢失。 问题解析 执行这段代码，你会发现解构出来的属性会丢失响应

在我们构建响应式系统的过程中，虽然对于原生 JavaScript 对象的处理已经相当完善，但数组 (Array) 与普通对象的属性不同，数组的 length 属性与其数值索引之间有紧密的联动关系。 手

watch 的一个核心用途，是在响应式数据发生变化时执行 副作用（Side Effect）。 然而，当副作用是异步的或需要手动清理时，就会出现一个常见问题： 如果监听的数据在短时间内多次变更，前一次的

Watch 常用的选项有： immediate：初始化立即执行一次 deep：深度监听 once：只执行一次，执行后自动停止监听 我们先写一个函数，接受三个参数，默认值是空对象。 immediate

watch 是 Vue 中非常重要的一个 API，它允许开发者在响应式数据发生变化时，执行特定的副作用（side effects）。这些副作用可以是异步行为（例如发起请求），也可以是基于状态变化而执行

在上一篇文章中，我们提到将通过「缓存」机制来解决 computed 在访问时重复执行的问题。 在 Vue 3 的源码里，computed 是靠一个「脏值标记（dirty flag）」来判断是否需要重新