100个酷炫的数据可视化大屏总有一款适合你(含演示实例)，30款 vue3 数据可视化大屏登录页下载

js 避免重复注册监听

js yekong

在JavaScript中，为了避免重复注册监听器，你可以采用以下方法：

  1. 使用匿名函数时，将监听器函数分配给一个变量。这样，你可以通过检查该变量是否已分配来避免重复注册。
var myEventListener;
if (!myEventListener) {
  myEventListener = function (event) {
    console.log('Event triggered:', event);
  };
  element.addEventListener('click', myEventListener);
}
  1. 使用函数名而不是匿名函数。这样，你可以检查该函数是否已被注册为事件监听器。
function myEventListener(event) {
  console.log('Event triggered:', event);
}
if (!element.hasMyEventListener) {
  element.addEventListener('click', myEventListener);
  element.hasMyEventListener = true;
}
  1. 使用Set数据结构存储已注册的监听器，然后检查监听器是否已存在于集合中。
var eventListeners = new Set();
function myEventListener(event) {
  console.log('Event triggered:', event);
}
if (!eventListeners.has(myEventListener)) {
  element.addEventListener('click', myEventListener);
  eventListeners.add(myEventListener);
}

注意：这些方法并不是绝对可靠的，因为浏览器可能会对事件监听器进行垃圾回收。所以，仍然存在潜在的重复注册风险。但在大多数情况下，这些方法应该足够有效。

喜欢