chrome 开发工具显示事件侦听器已泄露

问题描述 投票:0回答:1

新的 javascript 开发,我才开始涉足 webdev 世界。 我觉得我被 chrome 开发工具点燃了,或者我完全误解了removeEventListener 的工作原理。

这是一个已知问题还是我做错了什么?

chrome工具截图

我所做的是点击5~6次,然后按内存旁边的收集垃圾按钮(扫帚图标),这会产生锯状图案。但事件监听器的净数量不断增加。

这是我用来生成此代码的代码。

<!doctype html>
<html>
  <head>
    <script>
      function handleClick(e) {
        console.log("click");
        document.removeEventListener("click", handleClick);
        document.addEventListener("click", handleClick);
      }
      document.addEventListener("click", handleClick);
    </script>
  </head>
  <body></body>
</html>

堆栈溢出中还有另外 2 个实例报告了类似的事情,但它们似乎都没有正确回答。

JavaScript 监听器不断增加 Chrome 开发工具中的监听器性能分析结果

javascript google-chrome-devtools
1个回答
0
投票

重新添加事件监听器每次都会创建一个新的函数实例,导致 Chrome 将每个实例视为单独的监听器,即使函数名称相同。

为什么同一个函数会同时添加和删除监听器?其他一些点击是否应该删除另一个触发器中的侦听器?

© www.soinside.com 2019 - 2024. All rights reserved.