javascript - 如何在 JavaScript 中管理复杂的异步处理？

Question

我正在启动一个包含多个过程的 Web 应用程序，这需要一些时间。 为了减少加载时间，我想实现如下异步处理:

loadXML()-----
              \
loadCanvas()---setupCanvas()
                            \
setupYoutubePlayer()---------startApplication()

也就是说，当页面加载时，我想启动loadXML()、loadCanvas()和 setupYoutubePlayer() 同时触发 setupCanvas() 当 loadXML() 和 loadCanvas() 完成，setupApplication() 在 setupCanvas() 之后触发，并且 setupYoutubePlayer() 完成。

loadXML()和setupCanvas()包含AJAX处理，setupYoutubePlayer()包含API访问，需要API指定的回调函数(onYouTubeIframeAPIReady())。

经过几天的谷歌搜索，我发现 jQuery.Deffered和 Async.js .说到 Deffered，我可以包装所有 Deferred.promise() 和 Deferred.resolve() 处理，但我没有找到简单的解决方案 使用 when() 和 then() 实现这个嵌套的异步处理。 至于 Async.js，我不知道如何处理 setupYoutubePlayer()。

我错过了什么？还是在这种情况下还有其他知识？ 请帮忙。谢谢。

Answer 1

这非常简单，即使只有 jQuery promises(假设 1.8+)你也可以这样做:

var xml = loadXML();
var canvas = loadCanvas();
var youtubePlayer = setupYoutubePlayer();
$.when(
    $.when(xml, canvas).then(setupCanvas),
    youtubePlayer
).then(startApplication);