javascript - For循环变量自动递增

Question

我创建了一个 for 循环并在其中运行 Javascript(jquery) 代码。但不知何故，for 循环变量会自动递增。

for (var i=0; i<len; i++) {    //len=2
        console.log(i);  // outputs 0 and 1 as expected 
        $.ajax({
        url:'execute.php',
        method:'GET',
        data:{
            link: items[i]
        },

        success:function(data){
            console.log(i);       //outputs 2 and 2. It sould be 0 and 1
            $("#div1").html(data);
            var item = $(".sticky-item-title .title").html();
            $("#product-"+ i).html(item);
        },
        error:function(data){
            alert('error' + data);
        }
    });
}

$.ajax 之前的 console.log 按预期显示 0 和 1(我在 len 中有 2 个项目)。但是 success 函数中的 console.log 显示为 2 和 2。为什么以及在哪里增加。我尝试了这段代码

for (var i=0; i<len; i++) {
        var s=i;
        $.ajax({
        url:'execute.php',
        method:'GET',
        data:{
            link: items[s]
        },

        success:function(data){
            console.log(s);          //outputs 1 and 1. It should be 0 and 1 
            $("#div1").html(data);
            var item = $(".sticky-item-title .title").html();
            $("#product-"+ s).html(item);
        },
        error:function(data){
            alert('error' + data);
        }
    });
}

这里变量 s 显示 1 和 1，而不是 0 和 1。

我在这里做错了什么。提前致谢

Answer 1

当您使用 var 定义变量时，您只是声明了一个变量，该变量在每个循环中都会被覆盖。在循环之后的异步回调中，变量就是最后一次迭代的值。您可以通过使用 let 或定义自调用函数并将迭代值作为参数传递来规避此问题。

for (let i = 0; i < array.length; i++) { ... }

或

for (var i = 0; i < array.length; i++) {
   (function(i) {
   ...
   })(i);
}