vue2-3的差异作为一个面试高频的题目而受到了光大前端同学的关注下面小编就结合自己的理解试着说一说他们之间的区别
替换
在 Vue 2 中，Vue.js 使用 来实现响应式系统。这个方法通过在对象上定义 getter 和 setter 来追踪对属性的访问和修改。然而，它有一些局限性，比如无法监视数组的变化和动态添加属性。
Vue 3 引入了 对象作为其响应式系统的基础。 对象允许您创建一个代理，可以拦截并定义基本操作的自定义行为。相比于 ， 提供了更灵活的方式来实现响应式。
以下是 相对于 的优势：
-
更全面的拦截：
- 允许您拦截更多类型的操作，包括属性的读取、设置、删除等。相比之下， 只能拦截属性的读取和设置。
-
支持数组的变化：
- 使用 可以直接拦截数组的变化，包括数组元素的增加、删除和重排等操作。而 无法直接监视数组的变化，需要通过一些额外的处理来实现。
-
动态添加属性：
- 使用 可以拦截动态添加属性的操作，包括使用 或 来向响应式对象添加新属性。而 无法拦截这些动态添加属性的操作。
-
性能优化：
- 由于 提供了更全面的拦截和更灵活的实现方式，通常情况下比 更高效。例如，在某些情况下， 可以直接在 JavaScript 引擎层面优化代理的行为，而无需额外的操作。
-
更易于使用和理解：
- 提供了一种更直观和易于理解的方式来定义响应式行为，特别是对于动态添加属性和数组变化等场景。这使得 Vue 3 的响应式系统更加易于使用和扩展。
关于 替换的一些细节
其实vue3并没有完全放弃Proxy来全面代替，如果有阅读useReactive和useRef的源码部分的同学就会发现它的内部逻辑大概是这样子的：
首先如果开发者定义了一个useRef () 那么内部执行的时候首先会判断你的数据类型 如果是useRef对象就会直接返回 如果是一个引用类型的数据那么在创建useRef对象时createRef的函数会在内部调用useReactive从而创建一个Proxy进行数据监听，如果定义的useRef是一个非引用类型的时候那么useRef还是会通过
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/bian-cheng-ri-ji/9763.html