Proxy与defineProperty的区别

Proxy和Object.defineproperty区别:

  1. defineproperty只能监听某个属性不能全对象监听,监听要知道哪个对象哪个属性,而proxy只要知道是哪个对象就可以,不用for in循环,提升了效率
  2. 当使用 defineProperty 时,我们修改原来的 obj 对象就可以触发拦截,而使用 proxy,就必须修改代理对象,即 Proxy 的实例才可以触发拦截

Object.defineproperty优点:

  1. 兼容性好,支持IE9

Object.defineproperty缺点:

  1. 对数组的支持不好,无法监听到数组的变化,在Vue官方文档说明了可以监听到数组的变动,但只限于push、pop、shift、unshift、splice、sort、reverse方法。实际上是他们对这几种方法进行了重写。
  2. Object.defineProperty监听的是对象的属性,当一个对象为深层嵌套的时候,必须进行递归遍历,比较麻烦。

Proxy对比Object.defineProperty优点:

  1. Proxy可以劫持整个对象,这样以来操作便利程度远远优于Object.defineProperty。
  2. Proxy可以直接监听数组的变化,无需进行数组方法重写。
  3. Proxy支持13种拦截操作,是Object.defineProperty不具备的。
  4. Proxy返回的是一个新对象,我们可以只操作新的对象达到目的,而Object.defineProperty只能遍历对象属性直接修改
  5. Proxy作为新标准将受到浏览器厂商重点持续的性能优化

Proxy对比Object.defineProperty缺点:

  1. Proxy的兼容性不是太好,不兼容IE,且无法通过polyfill提供兼容。 
js
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里只属于前端工程师。