為什么當for循環為3時JavaScript始終向4發出警報？

Question

為什么此JavaScript在for循環為3時始終向4發出警報？

// alert
function reOrderLayers(layerToaAlter) {
alert(layerToaAlter);
}

// prepare
var laCount;
for (laCount = 1; laCount <= 3; laCount++) {
    var la = document.getElementById("layerChanger"+laCount);
    la.addEventListener("click", function () { reOrderLayers(laCount) });
}

Answer 1

當循環結束時，表示i >3 ，要在函數調用中保留特定數字，請使用閉包：

  la.addEventListener("click", (function(count) { return function () { reOrderLayers(count) } })(laCount)  );

Answer 2

for循環將一直持續到laCount == 4 （最后一次執行循環時，該值為3，然后將其遞增為4，以使循環測試失敗）。 因此，在for循環之后該值為4。

Answer 3

因為當您單擊元素時； for循環已經完成，並且laCount的當前值為4；

您應該創建一個上下文來為每個layerChanger保存laCount：

function reOrderLayers(layerToaAlter) {
   alert(layerToaAlter);
}
function context(la, laCount){

         la.addEventListener("click", function () { reOrderLayers(laCount) });
  }

// prepare
var laCount, la;
for (laCount = 1; laCount <= 3; laCount++) {
    la = document.getElementById("layerChanger"+laCount);
    context(la, laCount);
}

Answer 4

您沒有在循環中立即調用reOrderLayers ，而是構造了一個函數文字。 文字將有一個閉包，它引用環境中的laCount變量，當最終觸發click事件時，該變量將為4。

Answer 5

因為：

var c = 0;
for(c = 1; c <= 3; c++) {};
alert(c); // alerts 4.

Answer 6

在前3次迭代中， for循環進入主體並執行內部的代碼。 一旦您進行了第4次迭代， lacount就會增加，並且條件失敗，因此您不必再次進入循環。

如果出於某種原因需要lacount為3 ，則可以嘗試將初始for循環條件設置為i < 3 。