如何异步处理:功能C取决于功能B,取决于功能A.

时间:2015-03-24 14:49:47

标签: javascript ajax asynchronous callback

我有三个函数都使用来自全局对象的数据。此全局对象在一个函数中填充来自本地数组的数据,并使用来自第二个函数的ajax请求的数据填充。第三个函数依赖于对象中的数据,因此必须完成ajax请求。

我相信我误解了回调。这是我的所作所为:

var currentCharacter = {}

// this function gets the local data and then calls the second function
function loadData(getMarvelData) {
   // do things to fill currentCharacter
   getMarvelData(); // this is the callback to the next function (no ?)
}

// this function performs the ajax request, then calls the third function
function getMarvelData(getGoogleMap) {
   // do ajax request and add stuff to currentCharacter
   getGoogleMap(); // this is the callback to the final function (no ?)
}

function getGoogleMap() {
   // do Google Map related stuff with data from currentCharacter
}

我认为将函数设置为另一个函数的参数然后执行它会使函数在继续之前依赖于另一个函数。显然,我仍然在试图使其工作一周后仍然误解了回调。实际上,getMarvelData函数甚至都没有被调用,因为我从未看到警报弹出窗口,而currentCharacter对象只有来自loadData函数的数据。

有人可以为我的代码显示正确的方法,或者我的方法是使这三种功能在这种情况下是正确的。

完整存储库位于:https://github.com/ChaMbuna/Marvel-Map V0.9实际上正在工作,但是ajax调用设置为同步运行(它仍然是btw)从那时起我一直在检修我的代码以使其异步工作并删除所有jQuery(这是一个Udacity项目并删除jQuery是由教师建议。)

感谢帮助

2 个答案:

答案 0 :(得分:0)

我没有足够的声誉来发表评论,但是一个疯狂的猜测,你应该删除loadData& getMarvelData中的参数,或者在调用这些函数时实际传递一个函数。

答案 1 :(得分:0)

您必须正确传递参数。 试试这个:

var currentCharacter = {}
loadData(getMarvelData, getGoogleMap);

function loadData(f1, f2) {
   // do sth.
   f1(f2);
}

function getMarvelData(f2) {
   // do sth.
   f2(); 
}

function getGoogleMap() {
   // do sth.
}

我没有对它进行测试,但它应该有效。