jascript angular for循环在promise之后执行

jascript angular for loop executed after the promises

本文关键字:promise 之后 执行 循环 angular for jascript      更新时间:2023-09-26

我对promise和for循环有问题。以下代码未按顺序执行:

secondQuery.find().then(function(results) {
            alert("2") 
            for (var i in results) {
                (function(index){
                    var object = results[index];
                    var item_id = results[index].id;
                    var status = object.get("status");
                    var event_id = object.get("event_id");
                    var user_id = object.get("user_id");
                    var user_id_name = object.get("user_id_name");

                    var thumbimageurl = "";
                    var nFacebookFriends = 0;
                    var nInstagramFollowers = 0;
                    var nTwitterFollowers = 0;  
                    var query2 = new Parse.Query(User)
                    query2.equalTo("username",user_id)
                    return query2.first({
                        success: function(object) {
                            alert("3")
                            var thumbfile = object.get("thumb");
                            thumbimageurl = thumbfile.url();
                            nFacebookFriends = object.get('nFacebookFriends');
                            nInstagramFollowers = object.get('nInstagramFollowers');
                            nTwitterFollowers = object.get('nTwitterFollowers'); 
                        }
                    }).then(function(){
                        alert("4")
                        requests.push({
                            'thumb': thumbimageurl,
                            'item_id':item_id,
                            'status':status,
                            'event_id':event_id,
                            'user_id':user_id,
                            'user_id_name':user_id_name,
                            'nFacebookFriends':nFacebookFriends,
                            'nInstagramFollowers':nInstagramFollowers,
                            'nTwitterFollowers':nTwitterFollowers
                        })
                    })
                })(i)
            }
        }).then(function(){
                    alert('end')
                        $scope.requests = requests;
                        $localStorage.requests = requests;
                      //  alert(JSON.stringify(requests))
        })

在"2"警报而不是"3"answers"4"的循环之后,我直接得到了"结束"。有没有办法强制在下一个promise之前执行for循环?

您需要了解异步调用是如何发生的。这里发生的是,最外层的块(secondQuery.find().then...)被执行,当promise返回时,回调被同步执行(循环的所有迭代激发不同的异步调用),然后退出,以执行包含alert('end')then块;因为在您的代码中,我观察到query2.first是一个异步调用,它在调用end块之前不能返回。

如果您希望end块位于34之后,则必须将其链接到它们。这是保证你想要的顺序的唯一方法。或者,您可以查找promise.all()(如果您的库使用bluebird)或promise.al()(es6)

您可以创建一个承诺链,每个承诺都挂在链中的前一个承诺上。所以在for循环的每次迭代中,您可以不断地将promises添加到promise chain中。

注意:但我有一个问题@query2.first,它返回了一个promise,还回调了?在这种情况下,我不知道回调部分会发生什么。

    secondQuery.find().then(function(results) {
    alert("2");
    // We will create a chain of promises here,
    // Each of it is pending on previouse promise in the chain
    var promise = Promise.resolve();
    for (var i in results) {
        (function(index) {                    
            promise = promise.then(function() {                       
                var object = results[index];
                var item_id = results[index].id;
                var status = object.get("status");
                var event_id = object.get("event_id");
                var user_id = object.get("user_id");
                var user_id_name = object.get("user_id_name");

                var thumbimageurl = "";
                var nFacebookFriends = 0;
                var nInstagramFollowers = 0;
                var nTwitterFollowers = 0;  
                var query2 = new Parse.Query(User);
                query2.equalTo("username",user_id);
                //I am not very sure about this,  this return a promise also there is a callback
                //So When callback hits is out of this scope
                return query2.first({
                    success: function(object) {
                        alert("3")
                        var thumbfile = object.get("thumb");
                        thumbimageurl = thumbfile.url();
                        nFacebookFriends = object.get('nFacebookFriends');
                        nInstagramFollowers = object.get('nInstagramFollowers');
                        nTwitterFollowers = object.get('nTwitterFollowers'); 
                    }
                })
            })
            .then(function() {
                alert("4");
                requests.push({
                    'thumb': thumbimageurl,
                    'item_id':item_id,
                    'status':status,
                    'event_id':event_id,
                    'user_id':user_id,
                    'user_id_name':user_id_name,
                    'nFacebookFriends':nFacebookFriends,
                    'nInstagramFollowers':nInstagramFollowers,
                    'nTwitterFollowers':nTwitterFollowers
                })
            })
        })(i)
    }
    return promise;
})
.then(function(){
    alert('end');
    $scope.requests = requests;
    $localStorage.requests = requests;
    //  alert(JSON.stringify(requests))
})