javascript - 理解 JavaScript 中 forEach 和 for 的区别

Question

我正在使用 twitch.tv API 编写一个应用程序，为此我需要为不同的用户进行多个 getJSON() 调用。以下输出有任何解释吗？

//users array contains the list of users for which data is fetched
var users = ["freecodecamp", "brunofin", "storbeck", "medrybw", "comster404", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff"];

使用简单的 for 循环时:

for (var i = 0; i < users.length; i++) {
            var user = users[i];
            $.getJSON("https://api.twitch.tv/kraken/streams/" + user + "?callback=?", function(json) {
                var add = user;
                if(json.status === 422) {
                    add = add + ' ' + "Closed";
                } else {
                    if (json.stream === null) {
                        add = add + ' ' + "Offline";
                    } else {
                        add = add + ' ' + json.stream.game;
                    }
                }
                $("#userList").append("<div>" + add + "</div>");
            });
};

输出:

beohoff Closed
beohoff Offline
beohoff Offline
beohoff Offline
beohoff StarCraft: Brood War
beohoff Offline
beohoff Offline
beohoff Offline
beohoff Offline 
beohoff Closed
beohoff Offline

使用 forEach 时:

users.forEach(function(user) {
            $.getJSON("https://api.twitch.tv/kraken/streams/" + user + "?callback=?", function(json) {
                var add = user;
                if(json.status === 422) {
                    add = add + ' ' + "Closed";
                } else {
                    if (json.stream === null) {
                        add = add + ' ' + "Offline";
                    } else {
                        add = add + ' ' + json.stream.game;
                    }
                }
                $("#userList").append("<div>" + add + "</div>");
            });
});

输出:

brunofin Closed
comster404 Closed
storbeck Offline
terakilobyte Offline
freecodecamp Offline
medrybw StarCraft: Brood War
thomasballinger Offline
RobotCaleb Offline
noobs2ninjas Offline
habathcx Offline
beohoff Offline

在 forEach 的情况下，ajax 调用是按顺序进行的还是有其他情况？

Answer 1

与 for (var i = 0; i < users.length; i++)) { ... } ，您随后将值 0 直到 users.length-1 分配给 i并用它做一些事情，但你仍然停留在同一个封闭中。

由于 js 的异步特性，您在收到第一个答案之前发送了所有 json 请求。当您得到答复时，user有值(value)users[users.length-1]然后这将在您的所有输出中使用。

与 users.forEach(function(user) { ... } ，您为用户的每个元素创建一个新的闭包。在每个闭包中，您都有一个本地 user当 json 请求的响应到达时您将使用的变量。