vue3源码解析

isProxy 根据官方的解释，isProxy是用来检查对象是否是由 reactive 或 readonly 创建的 proxy。 编写测试 这一节，就可以在之前的单例基础上去添加断言即可 编码 现在

shallowReadonly 这一节，我们一起来实现shallowReadonly，从字面意思就是表层只读。 编写测试 从单测可以看出，通过shallowReadonly创建的是表层只读的响应式对象

reactive和readonly嵌套 之前，我们通过reactive创建的响应式对象都是一些简单的对象，并不存在内部属性的值为object或者array，下面我们一起来看下面这种情况该如何处理。 编

Stop 这个功能应该不用多说什么，看字面意思也能猜个八九不离十了，但作为程序员的我们，思想还是要严谨，老规矩，我们还是一起来看一个单测。 单测 下面，大家跟着单测的代码，逐行的看，其中会有以我自己的

isReadonly和isReadonly 前面我们已经实现了reactive和readonly，这一节，我们来实现两个方法isReactive和isReadonly，用来判断一个对象是否是react

Readonly readonly其实跟reactive是一个原理，都是一个proxy对象，只是readonly不能被set，这样就不会涉及到触发依赖，当然也就不需要去收集依赖。 编写单测 下面，还是

onStop 上一节，我们完成了stop的相关逻辑，通过stop(runner)可以避免响应式数据改变的时候自动执行runner函数，现在又有一个新需求，我想在stop执行的时候做一些处理，这又该怎么

Scheduler 在开始编写功能之前，我们先一起来看一下什么是scheduler，下面是从vue3中拷贝的单测。 单测 要了解一下功能点，最好的方式就是读懂单测。 从上面的单测中，我们可以知道sch

Runner 我们已经完成了响应式的整个流程，并已经达到数据改变的时候相关值也会跟着变化，今天我们就来处理一下effect函数的返回，之前，我们仅仅处理了如何调用effect传入的fn。 单测 接下来

依赖收集&触发依赖 在此之前，我们已经实现了reactive和effect，并且留了一个全局变量activeEffect，我们一起来思考一下，这些东西有什么用，又是怎么联系在一起的。 分析 react

Effect 上一节，我们已经完成reactive的基本逻辑，这一节，我们来创建一个effect，为后面的依赖收集和触发依赖做准备。 单测 下面，就跟着单测一起来了解effect的功能点。 同reac

Reactive 何为响应式对象，在我看来就是一个可以进行拦截的对象，vue2采用的是Object.defineProperty，vue3采用的是Proxy，至于vue3为什么要采用proxy这里我们

打包环境 在开始我们的项目之前，首先要做的当然是搭建开发环境，下面，我们先来了解我们需要哪些功能，然后根据对应的功能来配置环境。 node环境，这个是必须的，现在也没有几个项目说没用到nodejs了。