javascript / jquery for loop不适用于极其复杂的表达式

Question

我有这个javascript：

<script>
$("#P1").on("blur", function(){$("#Y1").val(getClass(this));});
$("#P2").on("blur", function(){$("#Y2").val(getClass(this));});
$("#P3").on("blur", function(){$("#Y3").val(getClass(this));});
$("#P4").on("blur", function(){$("#Y4").val(getClass(this));});
<script>

它是用jquery编写的。 我想在for循环中将其标记化。 我已经尝试了多次语法迭代，但是无法获得一种适用于复杂表达式的语法。

<script>
var i;
for (i = 0; i < 5; i++) {
$("#P" +i).on("blur", function(){$("#Y" +i).val(getClass(this));});
}
</script>

为什么这不起作用？

Answer 1

在for循环的末尾， i的值为5，因此每次调用blur处理程序时，解释器将看到i的值为5-如果只有＃Y1-4，则＃Y5不存在。

使用let代替，它具有块作用域而不是函数作用域，因此每次迭代都有一个独立的i绑定：

for (let i = 1; i < 5; i++) {
  $("#P" + i).on("blur", function(){
    $("#Y" + i).val(getClass(this));
  });
}

在使用for循环时，请始终使用let （如果可以的话，请使用const ），尤其是在涉及异步的情况下。 （实际上，无论如何，都应该在所有可能的地方使用let或const ，但这for避免bug尤其重要）