登录
首页 >  文章 >  前端

Object.defineProperty 和 Proxy 双重劫持 querySelector 时,为何会出现两次执行?

时间:2024-12-09 16:24:59 287浏览 收藏

本篇文章主要是结合我之前面试的各种经历和实战开发中遇到的问题解决经验整理的,希望这篇《Object.defineProperty 和 Proxy 双重劫持 querySelector 时,为何会出现两次执行?》对你有很大帮助!欢迎收藏,分享给更多的需要的朋友学习~

Object.defineProperty 和 Proxy  双重劫持 querySelector 时,为何会出现两次执行?

Object.defineProperty 与 Proxy 双重劫持对象执行原理解析

在提供的问题中,通过 Object.defineProperty 和 Proxy 对 querySelector 的劫持引入了疑惑,因为它执行了两次。

执行原理

  • 第一次执行:

    • 劫持 test 对象的 querySelector 属性,利用 Proxy 创建代理对象。
    • 当首次调用 test.querySelector 时,会触发代理对象的 apply 方法,它会记录 thisArgs 的上下文 ({}) 并返回被劫持的 document.querySelector 函数。
  • 第二次执行:

    • 在代理对象的 apply 方法中调用了 thisArgs.querySelector.apply(document, args)。
    • 此时,thisArgs 指向 test,而 querySelector 属性已被劫持,导致再次执行 apply 方法。
    • 然而,这一次,thisArgs 指向 document,因为它在之前通过 apply 改变了上下文。
    • 因此,现在调用的是 document.querySelector.apply(document, ...),与 test 没有任何关联。

关键点:thisArgs

理解执行过程的关键在于监视 thisArgs 的上下文变化。随着劫持的展开,它从指向 test 变为指向 document。每次 apply 方法调用时,thisArgs 的上下文都会影响执行的函数。

文中关于的知识介绍,希望对你的学习有所帮助!若是受益匪浅,那就动动鼠标收藏这篇《Object.defineProperty 和 Proxy 双重劫持 querySelector 时,为何会出现两次执行?》文章吧,也可关注golang学习网公众号了解相关技术文章。

相关阅读
更多>
最新阅读
更多>
课程推荐
更多>