vue3_basic

Question 1

vue3源码响应式实现(min版)

Question 2

对vue响应式的理解

Answer 2

把JavaScript对象或者原始数据类型的值包裹成响应式对象,通过拦截获取和修改操作，相应触发track和trigger，实现依赖数据的自动化更新

Question 3

vue实现功能的同时所做的性能优化

Answer 3

1 看源码让我比较惊艳的地方就是它在实现功能的同时，去做的性能优化，可以收获很多。
2 vue响应式原型模型来说，不是去直接存储effect函数，修改一次就马上执行，而是包装了一层对象对这个函数的执行实际进行管理，执行的方式是通过lazy 和 scheduler 来控制函数执行的时机。
3 当使用lazy选项时，effect函数只有在被依赖项实际被访问时才会被计算，而不是在每次变化时都立即计算。
4 当使用scheduler，使用数组管理传递的执行任务，最后使用 Promise.resolve 只执行最后一次。
5 注册全局地图依赖是使用WeakMap数据类型，Set数据类型存储effect函数,优化了性能。

Question 4

响应式模型实现的流程

Answer 4

1 讲述一下vue响应式模型关于reactive和ref

2 当要把一个js对象包裹成一个reactive对象，需要通过Proxy代理来实现，当读这个属性的值时，Proxy会拦截get操作，先执行track函数，把effect注册到依赖地图中。当修改这个属性的值时，拦截set操作，执行trigger函数，把关于改属性的effect函数挨个执行。

3 如果是要包裹成ref对象的话，对于原始数据类型的值来说，直接用对象语法的getter和setter配置，监听value属性，相应触发track和trigger函数，对于是引用数据类型来说，实际上就是用到了reactive的那一套流程，不过想要获取属性的值，需要.value才可以拿到值。