1. Object.defineProperty只能劫持对象的属性,从而需要对每个对象,每个属性进行遍历,如果,属性值是对象,还需要深度遍历。Proxy可以劫持整个对象,并返回一个新的对象。
  2. Proxy不仅可以代理对象,还可以代理数组。还可以代理动态增加的属性。

Object.defineProperty本身有一定的监控到数组下标变化的能力:
Object.defineProperty本身是可以监控到数组下标的变化的,但是在 Vue 中,从性能/体验的性价比考虑,尤大大就弃用了这个特性。具体我们可以参考 《记一次思否问答的问题思考:Vue为什么不能检测数组变动》这篇文章,文章底部配图中有尤大大的严肃回复截图; 下方的讨论区也很值得大家下去看一看,有对于 for / forEach / for .. in .. 几个循环方式的讨论。

关于 Vue 3.0 的其他信息我们可以参考 尤大大发布的 Vue 3.0 新特性预览PPT

另外补充一些其他资料给大家:

Vue 的响应式原理中 Object.defineProperty 有什么缺陷?的更多相关文章

  1. Vue 的响应式原理中 Object.defineProperty 有什么缺陷?为什么在 Vue3.0 采用了 Proxy,抛弃了 Object.defineProperty?

    Object.defineProperty无法监控到数组下标的变化,导致通过数组下标添加元素,不能实时响应: Object.defineProperty只能劫持对象的属性,从而需要对每个对象,每个属性 ...

  2. vue深入响应式原理

    vue深入响应式原理 深入响应式原理 — Vue.jshttps://cn.vuejs.org/v2/guide/reactivity.html 注意:这里说的响应式不是bootsharp那种前端UI ...

  3. vue.js响应式原理解析与实现

    vue.js响应式原理解析与实现 从很久之前就已经接触过了angularjs了,当时就已经了解到,angularjs是通过脏检查来实现数据监测以及页面更新渲染.之后,再接触了vue.js,当时也一度很 ...

  4. Vue 数据响应式原理

    Vue 数据响应式原理 Vue.js 的核心包括一套“响应式系统”.“响应式”,是指当数据改变后,Vue 会通知到使用该数据的代码.例如,视图渲染中使用了数据,数据改变后,视图也会自动更新. 举个简单 ...

  5. 深入解析vue.js响应式原理与实现

    vue.js响应式原理解析与实现.angularjs是通过脏检查来实现数据监测以及页面更新渲染.之后,再接触了vue.js,当时也一度很好奇vue.js是如何监测数据更新并且重新渲染页面.vue.js ...

  6. Vue的响应式原理

    Vue的响应式原理 一.响应式的底层实现 1.Vue与MVVM Vue是一个 MVVM框架,其各层的对应关系如下 View层:在Vue中是绑定dom对象的HTML ViewModel层:在Vue中是实 ...

  7. vue系列---响应式原理实现及Observer源码解析(一)

    _ 阅读目录 一. 什么是响应式? 二:如何侦测数据的变化? 2.1 Object.defineProperty() 侦测对象属性值变化 2.2 如何侦测数组的索引值的变化 2.3 如何监听数组内容的 ...

  8. Vue的响应式系统

    Vue的响应式系统 我们第一次使用Vue的时候,会感觉有些神奇,举个例子: <div id="app"> <div>价格:¥{{price}}</di ...

  9. 一探 Vue 数据响应式原理

    一探 Vue 数据响应式原理 本文写于 2020 年 8 月 5 日 相信在很多新人第一次使用 Vue 这种框架的时候,就会被其修改数据便自动更新视图的操作所震撼. Vue 的文档中也这么写道: Vu ...

随机推荐

  1. MacOS配置.bash_profile,重启终端后配置失效和MacOS .zshrc does not exist问题

    MacOS配置.bash_profile,重启终端后配置失效和MacOS .zshrc does not exist问题 场景 ​ 在Mac中配置golang环境变量更改GOPATH路径,在~/.ba ...

  2. Python--编码转换

    # -*- coding:gbk -*- # 即使设置文件编码为gbk,下方定义的字符串s1依旧为unicode # 获取默认编码格式 import sys print(sys.getdefaulte ...

  3. Nice Jquery Validator 事件

    订阅 .on("validation") 描述:每次验证完一个字段,都会触发 validation 事件,通过该事件可以获取到当前验证字段的验证结果. 示例: $('#form') ...

  4. refs转发 React.forwardRef

    2020-04-01 refs转发 前几天刚总结完ref&DOM之间的关系,并且想通了3种ref的绑定方式 今天总结一下refs转发 这是react中一直困扰我的一个点 示例: 输入: wor ...

  5. 基于移动最小二乘法的点云曲面拟合(python)

    1.移动最小二乘法介绍 为了更好地对数据量大且形状复杂的离散数据进行拟合,曾清红等人[1]开发出一种新的算法——移动最小二乘法.这种新的最小二乘算法为点云数据的处理提供了新的方法.使用点云数据拟合曲面 ...

  6. mapper.xml文件映射配置

    一.导入约束 为全局配置文件绑定dtd约束: 1)联网会自动绑定 2)没网的时候[/org/apache/ibatis/builder/xml/mybatis-3-mapper.dtd]:解压myba ...

  7. Spring中的JDBC API

    1 JdbcTemplate的诞生 JDBC作为Java平台访问关系数据库的标准API,其成功是有目共睹的.为了避免在JDBC API在使用中的种种尴尬局面(几乎程式一样的代码,繁琐的异常处理),Sp ...

  8. c语言中的c语言中realloc()函数解析

    c语言中realloc()函数解析 真是有点惭愧,这些内容本应该很早就掌握的,以前只是糊里糊涂的用,不知道在内存中具体是怎么回事,现在才弄清楚. realloc(void *__ptr, size_t ...

  9. 【转载】提高访问 github 的速度

    原文地址:https://www.cnblogs.com/liuchao888/p/11733996.html 工具地址:http://tool.chinaz.com/dns?type=1&h ...

  10. JAVA基础你需要知道的几点

    一.关于变量 变量可以看成可操作的存储空间,有如下三种: 局部变量:定义在方法或语句块内部,必须先声明初始化才能使用:生命周期从声明位置开始到方法或语句块执行完毕. 成员变量(实例变量):定义在方法外 ...