是否有更快的方法删除文档上的所有keyup事件监听器

Question

我有一个函数，可以将keyup监听器删除并添加到网页中

function addFunc1() {
document.addEventListener('keyup', func1);
document.removeEventListener("keyup", func2);
document.removeEventListener("keyup", func3);
document.removeEventListener("keyup", func4);
document.removeEventListener("keyup", func5);
document.removeEventListener("keyup", func6);
document.removeEventListener("keyup", func7);
}
function addFunc2() {
document.addEventListener("keyup", func2);
document.removeEventListener('keyup', func1);
document.removeEventListener("keyup", func3);
document.removeEventListener("keyup", func4);
document.removeEventListener("keyup", func5);
document.removeEventListener("keyup", func6);
document.removeEventListener("keyup", func7);
}
function addFunc3() {
document.addEventListener("keyup", func3);
document.removeEventListener('keyup', func1);
document.removeEventListener("keyup", func2);
document.removeEventListener("keyup", func4);
document.removeEventListener("keyup", func5);
document.removeEventListener("keyup", func6);
document.removeEventListener("keyup", func7);
}
...etc

但我想知道是否有更快的方法去除它们？因为我认为如果我一个接一个地删除，速度会很慢

我尝试过搜索，但只找到了cloneNode这样的解决方案，以删除元素中的所有事件处理程序

var clone = element.cloneNode(true);

但我不认为这将适用于我想要的

这个问题以前可能有人问过，但我就是找不到

提前感谢

Answer 1

将函数放入数组

const fns = [func1, func2, ...];

然后代替

function addFunc1() {

function addFunc2() {

进行

function addFunc(indexToAdd) {
for (const fn of fns) {
document.removeEventListener("keyup", fn);
}
document.addEventListener("keyup", fns[indexToAdd]);
}
addFunc(0);
// or
// addFunc(1);

另一种方法是只有一个功能，一直处于活动状态，然后重新分配活动索引：

let activeIndex = 0; // for example: have keyups run the first function
document.addEventListener('keyup', () => {
fns[activeIndex]();
});

然后，例如，切换到func3而不是func1，只需执行

activeIndex = 2;