javascript - 为什么 addEventListener ("resize") 会触发多次？

Question

已关闭。这个问题是 not reproducible or was caused by typos 。目前不接受答案。

---

这个问题是由拼写错误或无法再重现的问题引起的。虽然类似的问题可能是 on-topic在这里，这个问题的解决方式不太可能帮助 future 的读者。

已关闭 3 年前。

Improve this question

我有 2 个文件。我想知道为什么我会嗨 i+1 次。假设我将窗口大小调整了 1000 次，即 i=1000。一旦我点击窗口，我就会得到 1001 次 hi，而不仅仅是 1 次。我有一个包含 new EventHandler() 的小项目，我将窗口大小调整了 100 倍，它滞后了很多。我该如何避免这种情况..？对了，这是码笔 https://codepen.io/pen/?editors=1111

file-A

export.class SayHi{
  constructor(){
    document.addEventListener("click",()=>{
      console.log("hi")
    })
  }
}

file-B

import SayHi from "./file-A"
var i=0;
var sayHi=new SayHi();
window.addEventListener("resize",()=>{
  i++
  sayHi=new SayHi();
  console.log(i)
})

Answer 1

resize 事件确实触发了很多。在大多数台式机上，它会在调整大小过程中触发事件循环的每个周期。

为什么？因为每次调整大小都是一个单独的事件。

如果您只需要在调整大小完成后触发一个事件，您可以考虑对事件进行去抖动或限制。

Javascript debouncing and throttling on Window resize