我有两个函数,a
和b
,它们是异步的,前者没有await
,后者有await
。他们都将一些东西记录到控制台并返回undefined
。调用任一函数后,我会记录另一条消息,并查看该消息是在执行函数主体之前还是之后写入的。
function someMath() {
for (let i = 0; i < 9000000; i++) { Math.sqrt(i**5) }
}
function timeout(n) {
return new Promise(cb => setTimeout(cb, n))
}
// ------------------------------------------------- a (no await)
async function a() {
someMath()
console.log('in a (no await)')
}
// ---------------------------------------------------- b (await)
async function b() {
await timeout(100)
console.log('in b (await)')
}
clear.onclick = console.clear
aButton.onclick = function() {
console.log('clicked on a button')
a()
console.log('after a (no await) call')
}
bButton.onclick = function() {
console.log('clicked on b button')
b()
console.log('after b (await) call')
}
<button id="aButton">test without await (a)</button>
<button id="bButton">test with await (b)</button>
<button id="clear">clear console</button>
如果您在没有 的情况下启动测试await
,该功能似乎可以同步工作。但是使用await
,当函数异步执行时,消息会被反转。
async
当不存在await
关键字时,JavaScript 如何执行函数?
实际用例:我有一个await
条件执行的关键字,我需要知道该函数是否同步执行以呈现我的元素:
async function initializeComponent(stuff) {
if (stuff === undefined)
stuff = await getStuff()
// Initialize
if (/* Context has been blocked */)
renderComponent() // Render again if stuff had to be loaded
}
initializeComponent()
renderComponent()
PS:标题有 JavaScript 关键字,以避免与其他语言中的相同问题混淆(即Using async without await)