对于 .getJSON 中的变量显示错误

Question

我有以下代码 (javascript/jQuery)

$(function(){
    for(var i=0;i<3;i++){

        $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data){
            console.log(i);
            console.log(data);
        });
    }
});

控制台日志：

3
Object { stream: Object, _links: Object }
3
Object { stream: Object, _links: Object }
3
Object { stream: Object, _links: Object }

难道 console.log(i); 应该在第一个循环中记录 0，在第二个循环中记录 1，在第三个循环中记录 2？但不知何故它总是 returns 3 :(

Answer 1

试试这个

$(function(){
    for(var i=0;i<3;i++){
        (function (index) {
            $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data) {
                console.log(index);
                console.log(data);
            });
        })(i)
    }
});

Answer 2

能在$.getJson中显示结果成功吗？

 $(function(){
            $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data){
              for(var i=0;i<3;i++){
                console.log(i);
                console.log(data[i]);
               }
            });
        });

你的 i=3 因为你的循环不等待 $.getJson 成功。它正在工作并立即增加值。

Answer 3

试试这个

    $.ajaxSetup({
        async: false
    });

    $(function(){
    for(var i=0;i<3;i++){
        $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data){
            console.log(i);
            console.log(data);
        });
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 4

如果您使用的是 ecma6，那么您可以使用 let 来避免关闭问题。它创建块范围。

$(function() {
    for (let i = 0; i < 3; i++) {

        $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data) {
            console.log(i);
            console.log(data);
        });
    }
});

否则，您可以使用IIFE

$(function() {

    for (var i = 0; i < 3; i++) {

        (function(i) {

            $.getJSON("https://api.twitch.tv/kraken/streams/esl_csgo", function(data) {
                console.log(i);
                console.log(data);
            });

        })(i)

    }
});

同理，可以使用bind.

对于 .getJSON 中的变量显示错误

for variable within .getJSON displayed wrong

javascript

jquery

getjson

console.log