1

我正在尝试编写“现代” js，并通过使用 async/await 来避免回调和承诺。但是，我不能完全理解它是如何工作的。我认为“下一个”功能会等到第一个功能完成后再运行。

在我的应用程序中，这四个函数都是对 MySQL DB 的 ajax 调用，以更新记录并选择其他数据并构建要写入 DOM 的新 html 表。

四个函数按顺序完成，导致界面不正确。刷新整个页面解决了这个问题，但如果函数只是按照我定义的顺序运行和完成，那么界面就是正确的。

async function reloadAllTable(workOrderId,statusId) {
    await techSelectTable(workOrderId);
    await updateWOStatus(workOrderId,statusId);
    await loadWOScheduled(statusId);
    await loadWOAssigned(statusId);
}

reloadAllTable(workOrderId,statusId);
4

1 回答 1

2

我刚想到这个，但对于发现这个问题的其他人来说，迟到总比没有好。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function

异步函数可以包含一个等待表达式，它暂停异步函数的执行并等待传递的 Promise 的解析，然后恢复异步函数的执行并返回解析的值。

您的问题可能是要使用 async/await 语法，被调用的函数必须返回一个承诺。如果没有承诺等待解决，则继续执行下一条语句。正如您在上面所说，这些函数不会返回承诺，因此不会以所需的顺序加载。

要按照您指定的顺序执行代码，您需要修改您的函数以返回一个承诺。如果 AJAX 调用返回一个 thenable，您可以将其转换为一个 Promise，并等待该 Promise：

Promise.resolve( yourThenable )

对于遵循节点回调样式的函数，一种方法是通过 promisify-node 模块（https://www.npmjs.com/package/promisify-node）：

var promisify = require("promisify-node");

function myCallbackFunction(callback) {
  callback(null, true);
}

// Convert the function to return a Promise. 
var wrap = promisify(myCallbackFunction);

// Invoke the newly wrapped function. 
wrap().then(function(value) {
console.log(value === true);
});
于 2018-01-13T08:29:56.237 回答