setTimeout() 只運行一次，多次調用時

Question

所以，我想要完成的是一個傷害系統，所以當敵人靠近玩家時（玩家在屏幕上的位置）他們會受到傷害。 但是，由於屏幕上同時有多個敵人，我不希望玩家被 10 個堆棧轟炸並立即死亡。 所以這是我的解決方案。

createjs.Ticker.addEventListener("tick", damage1);

function drop() {
    if (eX > p1.x - 40 && eX < p1.x + 40) {
        health -= 1;
        console.log("Health is: " + health);
    }
}

function damage1() {
    for (x = 0; x < enemy.length; x++) {
        eX = enemy[x].x;
        eY = enemy[x].y;
        if (eY > p1.y - 25 && eY < p1.y + 25) {
            setTimeout(drop, 2000);
        }
    }
}

然而，這並不像我預期的那樣工作。 我認為會發生的是，如果 if 語句通過，它將設置超時，等待 2 秒，然后進入它帶走健康的函數。 然而，實際發生的是它到了超時，等待 2 秒，然后每滴答運行一次外賣健康命令，所以它只等待一次。

我正在 adobe animate, html5 canvas 中工作，如果這有什么改變的話

Answer 1

setTimeout函數基本上是在同一時間調用的，但調用的是enemy.length次，因為 for 循環的每次迭代不會等待setTimeout回調完成。 如果將console.log添加到drop函數中，您會看到它被多次調用。 如果您希望在 for 循環中為每個索引添加延遲，您可以更改為：

setTimeout(drop, 2000 * (x + 1))

Answer 2

即使有適當的延遲，遍歷敵人的長度仍然會帶走相同數量的生命值，只是延遲。

我會做的是取消健康，禁用命中檢測，然后設置一個計時器，在此期間玩家是無敵的。 這樣玩家一次擊中一擊並有時間逃跑。