为什么Object.defineProperty能用来做数据劫持是什么意思呢

来源：蜘蛛抓取(WebSpider) 时间：2020-07-01 13:29 标签： 数据劫持是什么意思
// 数据劫持的核心属性 // 每次获取对潒的这个属性的时候就会被这个get方法给劫持到 // 每次设置这个对象的属性的时候，就会被set方法劫持到 // 设置的值也会劫持到

双击01.html文件,在浏览器中打开;然后再控制台输出obj.name,会得到下面的结果显示:

证明: 每次获取对象这个name属性,就会触发get方法

接着再在控制台输出’ = ‘ls’`,结果如如下所示:

证奣: 每次设置对象这个name属性,set方法就会触发,而且newValue就是它要修改的值

如果,我们将01.html做一些完善:
然后就达到了数据劫持的效果~

数据劫持指的是在访问或者修改對象的某个属性时通过一段代码拦截这个行为，进行额外的操作或者修改返回结果

  • 所谓的嵌套对象，是指类似

如果是这一类嵌套对象那就必须逐层遍历，直到把每个对象的每个属性都调用 Object.defineProperty() 为止 Vue 的源码中就能找到这样的逻辑 (叫做 walk 方法)

为什么vue3.0会使用proxy代理对象实现数据的綁定？

在数据劫持这个问题上Proxy 可以被认为是 Object.defineProperty() 的升级版。外界对某个对象的访问都必须经过这层拦截。因此它是针对 整个对象而不是 對象的某个属性，所以也就不需要对 keys 进行遍历这解决了上述 Object.defineProperty() 的第二个问题

之所以 Vue3.0 要使用 Proxy 替换原本的 API 原因在于 Proxy 无需一层层递归为每个属性添加代理，一次即可完成以上操作性能上更好，并且原本的实现有一些数据更新不能监听到但是 Proxy 可以完美监听到任何方式的数据改变

我要回帖

更多关于 数据劫持是什么意思 的文章

 

随机推荐