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. k8s aliyun mirros

    安装kubernetes的时候,需要安装kubelet, kubeadm等包,但k8s官网给的yum源是packages.cloud.google.com,国内访问不了,此时我们可以使用阿里云的yum ...

  2. P3939 数颜色 线段树动态开点

    P3939 数颜色 线段树动态开点 luogu P3939 水.直接对每种颜色开个权值线段树即可,注意动态开点. #include <cstdio> #include <algori ...

  3. Java for循环的语法和执行顺序

      关于java的for循环想必大家非常熟悉,它是java常用的语句之一.for循环是最灵活也是最常用的循环结构,表达式一般如下: for(表达式1;表达式2;表达式4){ 表达式3; } 执行顺序: ...

  4. angularJs driective指令小实例

    做一个下拉菜单,体会指令各参数的作用 html代码 <script type="text/ng-template" id="mydropdown.html" ...

  5. python3实例

    1.一行代码求一个数的阶乘 例如:求5的阶乘 from functools import reduce print((lambda k: reduce(, k+), ))()) 借鉴:https:// ...

  6. 数据结构Java版之排序算法(二)

    排序按时间复杂度和空间复杂度可分为 低级排序 和 高级排序 算法两种.下面将对排序算法进行讲解,以及样例的展示. 低级排序:冒泡排序.选择排序.插入排序. 冒泡排序: 核心思想,小的数往前移.假设最小 ...

  7. mysql数据库单独移动位置

    在新版本中.sym方式已不再支持,最新的方式是使用软链接方式(Windows),官方文档:https://dev.mysql.com/doc/refman/5.7/en/windows-symboli ...

  8. ASP.NET进行请求转发

    前言 前两天将网站的部分功能在小程序上实现,网站的后台是http,没有配置域名和安全证书,小程序的线上版本是无法访问的,因此需要从配有域名和安全证书的站点进行转发.即小程序请求A,A转发请求到B,B获 ...

  9. RK3288 添加普通串口uart1和uart3

    CPU:RK3288 系统:Android 5.1 diff --git a/device/rockchip/common/init.connectivity.rc b/device/rockchip ...

  10. OpenResty之 limit.count 模块

    原文: lua-resty-limit-traffic/lib/resty/limit/count.md 1. 示例 http { lua_shared_dict my_limit_count_sto ...