無論如何我可以將變量設置為一個數字范圍並將其包含在 function 中嗎？ (javascript)

Question

onEvent("pb" + 1, "click", function() {
console.log(("pb" + 1) + " was clicked!");
});

onEvent("pb" + 2, "click", function() {
console.log(("pb" + 2) + " was clicked!");
});

onEvent("pb" + 3, "click", function() {
console.log(("pb" + 3) + " was clicked!");
});

onEvent("pb" + 4, "click", function() {
console.log(("pb" + 4) + " was clicked!");
});

我必須編寫其中的 80 個函數......

我想這樣做，所以我可以使用一個變量來包含 1-80 的范圍：

 onEvent("pb" + [1, 80], "click", function() {
 console.log(("pb" + [1, 80]) + " was clicked!");
 });

我不確定是否可以將變量定義為一組單獨的數字。

Answer 1

使用循環：

for (let i = 1; i <= 80; i++) {
    onEvent("pb" + i, "click", function()
        console.log("pb" + i + " was clicked");
    })
}

確保使用let而不是var ，以便為每次迭代獲得一個新的綁定。 否則你會遇到Javascript 臭名昭著的循環問題？

Answer 2

不幸的是，范圍迭代器還沒有內置。 但它們制作起來很簡單（使用循環）：

function* range(start, end) {
    for (let i = start; i <= end; i++) {
        yield i
    }
}

然后，您可以這樣做：

for (let value of range(1,80)){
  console.log(value)
}

或這個：

range(1,80).forEach(value => console.log(value))

為什么這樣做而不僅僅是一個循環？ 好吧，取決於，有時循環更有意義。 但這里有一些可能會更好的原因：

• 更多意圖揭示代碼：有一個 function 命名范圍告訴你你打算做什么：使用一系列值
• 更好的提取：假設您后來發現循環效率低下（不太可能，但為了舉例）。 然后你可以在一個地方改變你range代碼，並在任何地方修復它。 或者，也許您想處理字母和數字的范圍。 現在您可以在一個地方進行更改，並且它在任何地方都有效。
• 同樣，假設您需要在許多地方使用范圍。 在任何地方都使用循環意味着您必須在使用該循環的每個地方都避免拼寫錯誤。 如果改為使用range ，則可以避免該問題。