vuez 与 Vue3 响应式比较

Vue2 的响应式

对象:通过 defineProperty 对对象的已有属性值的读取和修改进行劫持(监视/拦被)。

数组:通过重写数组、更新数组等一系列更新元素的方法来实现元素修改的劫持。

存在的问题如下:

  1. 对象直接新添加属性或删除已有属性,界面不会自动更新。
  2. 数组直接通过下标替换元素或更新 length,界面不会自动更新 arr[O]= xx。

Vue3 的响应式

通过 Proxy(代理):拦截对data 任意属性的任意(13种)操作,包括属性值的读写、属性的添加、属性的删除等。

通过 Reflect(反射):动态地对被代理对象的相应属性进行特定的操作。

Proxy 官方文档:

https://developer.mozilla.org/zh-CN/docs/ Web/JavaScript/ Reference/Global_Objects/Proxy

Reflect 官方文档:

https:// developer. mozilla.org/zh-CN/ docs/ Web/ JavaScript/ Reference/Global_Objects/Reflect

相关推荐
漂流瓶jz1 小时前
解锁Babel核心功能:从转义语法到插件开发
前端·javascript·typescript
周小码1 小时前
shadcn-table:构建高性能服务端表格的终极解决方案 | 2025最新实践
前端·react.js
大怪v1 小时前
老乡,别走!Javascript隐藏功能你知道吗?
前端·javascript·代码规范
ERP老兵-冷溪虎山2 小时前
Python/JS/Go/Java同步学习(第三篇)四语言“切片“对照表: 财务“小南“纸切片术切凭证到崩溃(附源码/截图/参数表/避坑指南/老板沉默术)
java·javascript·python·golang·中医编程·四语言同步学习·职场生存指南
webYin2 小时前
vue2 打包生成的js文件过大优化
前端·vue.js·webpack
gnip2 小时前
结合Worker通知应用更新
前端·javascript
叶玳言3 小时前
【LVGL】从HTML到LVGL:嵌入式UI的设计迁移与落地实践
前端·ui·html·移植
高级测试工程师欧阳3 小时前
HTML 基本结构
前端
Gazer_S3 小时前
【Element Plus 表单组件样式统一 & CSS 文字特效实现指南】
前端·css·vue.js
一只小阿乐3 小时前
Html重绘和重排
前端·html