首页
题库
面试
求职
学习
竞赛
More+
所有博客
搜索面经/职位/试题/公司
搜索
我要招人
去企业版
登录 / 注册
首页
>
试题广场
>
Vue3 为什么改用 Proxy 实现响应式?Vue2 的
[问答题]
Vue3 为什么改用 Proxy 实现响应式?Vue2 的 defineProperty 有哪些局限?
添加笔记
求解答(0)
邀请回答
收藏(28)
分享
纠错
12个回答
添加回答
3
什么都不怕g
vue2的defineProperty只针对已知属性的操作,不能对数组下标进行操作,不能对数组进行增删 而vue3改用了Proxy实现响应式,没有上述的限制
发表于 2025-10-20 19:16:06
回复(0)
2
WangYibo
VUE3 该用proxy是为了解决VUE 2 Object.defineProperty无法检测属性 增加/删除、数组索引变化、性能更新等根本局限,从而提供了一个更加强大的,高效的全面响应式系统
发表于 2026-01-14 14:01:44
回复(0)
2
温千蕴
vue2只能拦截已存在的属性,如果要进行新增啊,删除这些操作就需要用$set和$delete进行手动添加。而且他是无法经监听数组下标对这个对象进行赋值以及改变,通常会造成一个视图不更新的现象,而且他是需要深度遍历对象的每一次都要重新写那七个函数,性能会变,慢速度也会变慢。 vue3是一个对象级的响应是。对于增删这些操作进行自动捕获的,不需要我们用$set进行手动添加。而且它使用的是一种懒加载的方式就是你用到哪一层才会进行哪一层的使用,这个时候页面初始化会非常快性能也很好。
发表于 2025-09-17 16:45:00
回复(0)
0
牛客396151831号
Proxy解决了vue2中defineProperty的一些劫持问题,对象属性增加和删除,以及对数组的操作没法劫持的问题。虽然vue2中重写了数组的7个修改数组的本身的方法,以及提供了$set方法。但是对直接修改数组下标和length依旧是没法劫持的。Proxy不但能解决以上问题,还能支持更多数据类型,map,weakmap等
发表于 2026-03-18 14:58:13
回复(0)
0
秋木苏76
首先在初始化时候defineProperty需要对一个对象进行深层次的遍历,为其中每一个属性都增加getter和setter,即便这些属性不会用到。vue2的 defineProperty 只支持对现有的属性进行拦截,但对于新增和删除需要用Vue。set和。delete方法,此外vue2的 defineProperty 只支持对象的响应式,对于数组、map、set等并不支持。因此vue2对于数组的七个常用方法进行了重写,使其具有响应式,但是如果直接通过索引去修改元素,并不会引发响应式。
发表于 2026-03-13 15:18:53
回复(0)
0
已转码的钝角很开心
vue3改用proxy是为了解决vue2的Object.defineProperty()固有的无法检测属性的添加/删除,数组索引变化以及性能开销开销大等根本限制。从而提供一个更强大更高效的响应式系统 vue2的Object.defineProperty()的限制:无法检测属性的添加和删除,对数组监听需要黑客手段,性能开销大
发表于 2026-02-23 19:36:58
回复(0)
0
咫尺天涯201812092232845
1. defineProperty不能拦截没有存在的key, 所以vue2设置应该数据,当key不存在是,需要使用$set(obj, key) 去设置 2. 不能拦截数组的常用方法,所以vue2对数组就行了封装; 3. defineProperty初始的时候就需要深度给每一个key设置 defineProperty,造成初始化浪费很多性能,当数据量大,深度比较深时,很影响性能,而用 Proxy 就可以实现惰性监听,真正需要使用变量的时候我们才去监听
发表于 2026-01-29 10:47:47
回复(0)
0
牛客41767380号
vue2的defineProperty不能监听对象属性的新增和删除以及数组的变化,vue3的proxy可以补足这一缺陷
发表于 2026-01-10 14:01:36
回复(0)
0
amourmm
vue2的defineProperty不能监听对象属性的新增和删除,数组的变化。vue3的proxy可以弥补这一点,对于对象属性的新增和删除以及数组的变化都可以监听到,因为他为目标对象前设定了一层拦截,可以对数据进行过滤,修改和收集操作。只设立一层拦截就可以监听目标的变化。有兼容性。
发表于 2025-12-22 09:57:36
回复(0)
0
我从未看清
Vue中的元素Proxy可以对对象/数组的增加删除修改操作做出拦截,然后对些操作做处理,对数据进行更新,重新渲染dom元素做到响应式, Vue2中的Object.defineProperty 只能对初始化的数据属性,元素做出监听,一旦对对象/数组等进行操作,不会重新加载Dom , 无法做到响应式,想要使得数据响应式,得做特殊处理,更为麻烦
发表于 2025-11-24 15:55:09
回复(0)
0
卷柏1
Vue2 的 defineProperty(旧方法):麻烦多、能力弱,Vue3 的 Proxy(新方法):省心、全能
发表于 2025-11-06 08:50:02
回复(1)
0
秋水夏树
Object.defineProperty:无法监听对象增删;改写数组原型方法手动触发依赖通知;深层递归遍历耗时。 Proxy:支持对象所有基本操作拦截改写;访问到时才深度遍历;不需要 vue.set/vue.delete 增加心智负担。
发表于 2025-09-17 18:42:21
回复(1)
这道题你会答吗?花几分钟告诉大家答案吧!
提交观点
问题信息
来自:
Vue-牛客面经八股
难度:
12条回答
28收藏
443浏览
热门推荐
相关试题
讲讲 Vue3 响应式系统中的依赖...
评论
(6)
来自
Vue-牛客面经八股
何时需要自定义指令?指令的生命周期...
评论
(3)
来自
Vue-牛客面经八股
讲一下组件库封装思路,包括:属性透...
评论
(3)
来自
Vue-牛客面经八股
ECharts/地图等重型图表在 ...
评论
(1)
来自
Vue-牛客面经八股
登录态与 Token 刷新:无感刷...
评论
(2)
来自
Vue-牛客面经八股
扫描二维码,关注牛客网
意见反馈
下载牛客APP,随时随地刷题