javascript - 如何循环遍历我/ friend 并为每个用户分配来自 {USERID} 的图片/来自 FB.api 的图片

Question

使用 javascript 我得到了 facebook 好友列表，虽然它现在只返回名称和 ID，但我需要得到每个用户的照片。我尝试遍历响应，然后尝试调用 api 来获取图片，但由于它是异步调用，我无法将返回的图片与数组中 friend 的索引相关联。 *这是我在一般异步编程中遇到的一个问题，是否有针对此的标准模式？

例子。

FB.api('me/friends', function(response) {
    if(response.error == null){
        var friendsSale = response.data;
        var len = friendsSale.length;
        for(var x=0; x<len; x++){               
                FB.api(friendsSale[x].id+'/picture', function(response) {
                    //x no longer is the same x as the initial call, and I can't pass in the orignal array object into the FB.api function to return as part of the response... or can I?
                    friendsSale[x].pictureUrl = response;
                });
            }
        }
        //Then how do I know when I have all the pictures set so I can then set datamodle with the complete friend array?
        m.friends(friendsSale);
    }
});

Answer 1

是的，有一个模式:a Closure

    ...
    var len = friendsSale.length;
    for (var i = 0; i < len; i++) {
        (function() {
            var j = i;             
            FB.api(friendsSale[i].id+'/picture', function(response) {
                friendsSale[j].pictureUrl = response;
            });
        })();
    }

要知道所有调用何时返回，您可以简单地保留返回调用的计数器，例如

    ...
    var len = friendsSale.length;
    var returnedCallsCounter = 0;

    for (var i = 0; i < len; i++) {
        (function() {
            var j = i;             
            FB.api(friendsSale[i].id+'/picture', function(response) {
                friendsSale[j].pictureUrl = response;

                // Track number of returned calls
                returnedCallsCounter++;

                // Check if all calls have returned
                if (returnedCallsCounter == len) {
                    m.friends(friendsSale);
                }
            });
        })();
    }