VUE2响应式原理使用Object.defineProperty缺点
更新时间：2023年08月07日 10:51:07 作者：ZekiHoo
这篇文章主要为大家介绍了VUE2响应式原理使用Object.defineProperty缺点示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
引言
我们都知道vue2响应式原理是通过Object.defineProperty来实现的，通过劫持各属性的setter和getter，监听数据的变化。
Object.defineProperty 的缺点
无法监听对象属性的新增和删除
let num = 3
const cat = {
name: '大橘',
sex: 'boy',
age: 5
}
Object.defineProperty(cat,'age',{
get() {
console.log('get value')
return num
},
set(val) {
console.log('set value', val)
num = val
}
})
cat.age = 6 // 可以被监听到
cat.breed = '狸花猫' // 无法被监听到解决方式新增属性
this.$set(this.obj, 'a', 'abc')
删除属性
this.$delete(this.obj, 'a')
无法监听数组下标的变化，通过数组下标修改元素，无法实时响应。基于性能考虑vue2放弃了Object.defineProperty这一特性，如果数组长度过大，比如1000条，性能代价和用户体验收益不成正比 参考
push() pop() shift() unshift() splice() sort() reverse()
只能劫持对象的属性，所以我们需要对每个对象的所有属性进行遍历，然后需要深拷贝进行修改
而Proxy可以监听对象而非属性，相比前者具有更好的性能
以上就是VUE2响应式原理使用Object.defineProperty缺点的详细内容，更多关于VUE2 Object.defineProperty缺点的资料请关注脚本之家其它相关文章！
相关文章
本篇文章主要介绍了浅谈vue中慎用style的scoped属性，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
这篇文章主要介绍了利用vant如何给tabbar配置路由，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本文主要介绍了Element中select多数据加载优化的实现，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
mpvue 是美团开源的一套语法与vue.js一致的、快速开发小程序的前端框架，这篇文章主要介绍了基于mpvue的小程序项目搭建的步骤，非常具有实用价值，需要的朋友可以参考下2018-05-05
今天小编就为大家分享一篇浅谈vue中组件绑定事件时是否加.native，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了vue中@路径无法跳转到指定文件的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
这篇文章主要介绍了vue 获取url参数、get参数返回数组的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-11-11
这篇文章主要介绍了vue中@change兼容问题详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-10-10
最近项目中使用了minio作为静态资源管理服务,所以简单写一下如何通过minio来上传图片,下面这篇文章主要给大家介绍了关于Vue中通过minio上传文件的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-07-07
Vue中addEventListener() 监听事件案例讲解
这篇文章主要介绍了Vue中addEventListener() 监听事件案例讲解，包括语法讲解和事件冒泡或事件捕获的相关知识，本文结合示例代码给大家讲解的非常详细,需要的朋友可以参考下2022-12-12
最新评论