Vue3 使用Proxy替代了defineProperty。

Proxy 相比于 defineProperty 的优势

Object.defineProperty() 的问题主要有三个：

  • 不能监听数组的变化
  • 必须遍历对象的每个属性
  • 必须深层遍历嵌套的对象

Proxy 在 ES2015 规范中被正式加入，它有以下几个特点：

  • 针对对象：针对整个对象，而不是对象的某个属性，所以也就不需要对 keys 进行遍历。这解决了上述 Object.defineProperty() 第二个问题
  • 支持数组：Proxy 不需要对数组的方法进行重载，省去了众多 hack，减少代码量等于减少了维护成本，而且标准的就是最好的。

除了上述两点之外，Proxy 还拥有以下优势：

  • Proxy 的第二个参数可以有 13 种拦截方法，这比起 Object.defineProperty() 要更加丰富
  • Proxy 作为新标准受到浏览器厂商的重点关注和性能优化，相比之下 Object.defineProperty() 是一个已有的老方法。

缺陷：IE 不兼容

Vue3 相比 vue2的更多相关文章

  1. 想知道Vue3与Vue2的区别?五千字教程助你快速上手Vue3!

    从Vue3发布以来,我就一直对其非常感兴趣,就一直想着将其投入公司的生产中,但是开始考虑到很多不确定性就暂时对一些很小的功能进行一些尝试:慢慢的发现组合式Api的形式非常适合开发(个人感觉),尤其是V ...

  2. vue2升级vue3：vue2 vue-i18n 升级到vue3搭配VueI18n v9

    项目从vue2 升级vue3,VueI18n需要做适当的调整.主要是Vue I18n v8.x 到Vue I18n v9 or later 的变化,其中初始化: 具体可以参看:https://vue- ...

  3. 第三十一篇:vue3和vue2的不同

    好家伙 1.为什么会有vue3? Vue2和Vue3的区别 - 简书 (jianshu.com) 貌似是因为他的对手太优秀,所以他也必须进步 2.什么是api? 从文件操作开始谈API. 以C语言为例 ...

  4. vue3与vue2的区别

    全局属性 vue2 对于一些第三方插件,vue2中通常使用prototype原型来挂载到vue对象中 import Vue from 'vue' Vue.prototype.$http=Axiox V ...

  5. vue3 到底哪里好？看这一篇就够了

    之前写的关于 vue3 的文章,好多人吐槽:这些API每次使用都要引入一遍,感觉有点麻烦. 今天我们就来看看 vue3 相比 vue2 的优点有些啥? 为啥有些人说:自从写了 ts vue3 再也回不 ...

  6. 谈谈 Vue 模板和 JSX

    工具链 从学习曲线角度来讲,结合我个人体会,React 学习路线是比 Vue 陡峭的,这个和 JSX.Template 有关吗?当然有.在 React 中使用 JSX,众所周知, JSX 需要经过 T ...

  7. 前端经典面试题vue面试题

    1.什么是MVVM? MVVM是一种设计思想. Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑: View 代表UI 组件,它负责将数据模型转化成UI 展现出来,View ...

  8. 简单对比vue2.x与vue3.x响应式及新功能

    简单对比vue2.x与vue3.x响应式 对响应方式来讲:Vue3.x 将使用Proxy ,取代Vue2.x 版本的 Object.defineProperty. 为何要将Object.defineP ...

  9. vue3 区别于 vue2 的“与众不同”

    希望本篇文章能帮你加深对 Vue 的理解,能信誓旦旦地说自己熟练Vue2/3.除此之外,也希望路过的朋友可以帮助我查漏补缺.   区别 生命周期的变化 整体来看,变化不大,只是名字大部分需要 + on ...

随机推荐

  1. 001_软件安装之《MATLAB2016安装》

    测试电脑:win7 64位操作系统 下载地址: 链接:https://pan.baidu.com/s/1xkyhF6pdkx_kZiNjFireZw 密码:mvpp     链接:https://pa ...

  2. 洛谷 UVA10298 Power Strings 题解

    Analysis 结论:设字符串长度为n,最长相同前后缀的长度为kmp[i],如n%(n-kmp[n])=0,则答案为n/(n-kmp[n]),否则为1. 如果循环节多于一个,以前n-kmp[n]个为 ...

  3. 九.配置SMB共享(Samba共享)

    • Samba 软件项目 – 用途:为客户机提供共享使用的文件夹 – 协议:SMB(TCP 139).CIFS(TCP 445)  • 所需软件包:samba • 系统服务:smb   管理共享账号 ...

  4. C/C++ -- 判断字符串中存在中文

    电脑系统中的英文字符串和中文字符最根本的区别就在于: 1.英文的 ASCII 码,其最高位为 0,占一个字节 注:英文的ASCII码范围是在0到127,二进制为(0000 0000 ~ 0111 11 ...

  5. promise 及 setTimeout 执行顺序

    setTimeout(function() { console.log(1); }, 0); new Promise(function(res, rej) { res(2); console.log( ...

  6. Codeforces Round #583

    目录 Contest Info Solutions A. Optimal Currency Exchange B. Badges C. Bad Sequence D. Treasure Island ...

  7. P1069 细胞分裂——数学题，质因数分解

    P1069 细胞分裂 我们求的就是(x^k)|(m1^m2) k的最小值: 先给m1分解质因数,再给每个细胞分解: 如果m1有的质因数,细胞没有就跳过: 否则就记录答案: 注意整数除法下取整的原则: ...

  8. [提权]Windows COM组件提权漏洞 (CVE-2017-0213)

    0x01 简介 COM组件是微软开发的一种新软件开发技术,在这个COM框架的下,可以开发出多功能的组件,可以根据自己的需求进行定制开发,替换旧的组件,多个功能组件组合到一起,从而形成了一个复杂的定制化 ...

  9. Redis企业实战的一些坑

    附录:Redis企业实战的一些坑 一.前言 小伙伴们对Redis应该不陌生,Redis是系统必备的分布式缓存中间件,主要用来解决高并发下分担DB资源的负载,从而提升系统吞吐量. Redis支持多种数据 ...

  10. 《Glibc内存管理》笔记DAY2

    目录 Ptmalloc内存管理设计 Main_arena 与 non_main_arena chunk 的组织 空闲 chunk 容器 sbrk 与 mmap 内存分配概述 内存回收概述 边界标记法 ...