2016-11-22 50 views
0

我遇到了这个问题,我试图为从API检索图像并显示它的项目创建幻灯片。我有以下功能getPictures(id,number,callback),根据选项返回对象/数组/回调香草JS试图维持执行顺序(异步)

加载picturesList,我试图动态扩展它,它现在是一个全局变量,我正在修改点击nextPicture(button)时的修改。

next.onclick = function() { 
    append(); 
    nextPic(); 
}; 

我遇到的问题是,当我把一个条件来检查索引和检索一个新的picturesList,这样我可以追加到全球性的,它口口声声说,返回的数组是不确定的。

function append(){ 
    var t; 
    getPictures(pic[0].id, 7, function(response) { 
     t = response.pics; 
    }); 
    picturesList.push(t); 
} 

但执行顺序是什么,我无法控制并且是Java程序员几个概念都比较混乱。什么是最好的方法来解决这个问题?我读了回调和承诺,但他们似乎没有迎合设置全局变量(图片列表)

+1

执行顺序很好 - 这是你对它的理解,这就是你的问题。 't'只在对'getPictures()'的异步调用完成时才被设置,但是该调用之后的下一行代码立即执行。 – Archer

回答

0

如果你只需要在异步调用完成后调用nextPic()那么你可以简单地在回调中移动函数调用...

next.onclick = function() { 
    append(); 
}; 

function append(){ 
    getPictures(pic[0].id, 7, function(response) { 
     picturesList.push(response.pics); 
     nextPic(); 
    }); 
} 

如果你想在其他地方使用append功能,无需调用nextPic()那么你可以添加一个可选的回调函数...

next.onclick = function() { 
    append(nextPic); 
}; 

function append(callback){ 
    getPictures(pic[0].id, 7, function(response) { 
     picturesList.push(response.pics); 
     if (callback != undefined) { 
      callback(); 
     } 
    }); 
}