0

我已经知道这个问题已经被问过很多次了，但我不知道如何组织我的代码。我来自 C/C++ 语言并且仍然有思维方式，而我在 JS 中编写的内容看起来“毫无意义”。

我正在使用递归函数来生成地图上的旅行。问题是我需要对 2 个不同的 API 进行 2 次异步调用，第二个取决于第一个的结果。

实际上，我一直在使用回调函数，如下所示：

    function asyncFunction(param, callbackF) {
      // ... //
      $.get(url, function(data, status) {
        callbackF(data, status);
      })
    }

    function asyncFunction2(param, callbackF) {
        // ... //
        $.get(url2, function(data, status) {
          callbackF(data, status);
        })
    }

    function recursiveFunction(param1, param2, num, tab, distance) {
      //.. stuff with parameters //
      asynFunction(param1, function(result, status) {
        // .. stuff with parameters .. //

        //.. Algo stops when distance is 0 ..//
        if(!distance) {
          asyncFunction2(param, function(data, status) {
            // Final stuff //

            return; // End
          });
        }
        else recursiveFunction(param1, param2, num, tab, distance); // parameters has been updated
      });
    }

recursiveFunction(param1, param2, num, tab, distance);

它工作得很好，但有很多重叠，我不知道这个函数是否出错（例如，对 API 的调用失败等）。

问题是如何在这种情况下引入 Promises 或在 JS 中引入 async/await 术语？我怎样才能把这段代码变成更容易理解的方式？

谢谢。

4

1 回答 1

1

$.get already returns a Promise-like object. You just need to get rid of callbacks and return the promise.

function asyncFunction(param) {
  // ... //
  return $.get(url)
}

function asyncFunction2(param) {
    // ... //
    return $.get(url2)
}

Now you can use async/await with your functions. Something like this should work

async function recursiveFunction(param1, param2, num, tab, distance) {
  const result = await asyncFunction(param1);
  // .. stuff with parameters .. //

  if(distance) {
    await recursiveFunction(param1, param2, num, tab, distance); // parameters has been updated
  } else {
    await asyncFunction2(param)
  }
}


recursiveFunction(param1, param2, num, tab, distance);
于 2020-04-24T11:25:12.593 回答