JavaScript：使用await使asnyc代码看起来更同步[duplicate]

Question

我如何做到这一点？还是我理解了一些根本错误的东西？

const test = async function() {
    console.log('hi 1');
    await setTimeout(() => {
        console.log('timout1')
    }, 1000);
    console.log('hi 2');
    console.log('hi 3');
}
test()

后果

hi 1
hi 2
hi 3
timout1

预期结果

hi 1
timout1
hi 2
hi 3

Answer 1

我希望这段代码能帮助您理解async Wait。

function resolveAfter2Seconds() {
  	return new Promise(resolve => {
    	setTimeout(() => {
      		resolve('resolved');
    	}, 2000);
  	});
}

async function asyncCall() {
  	console.log('hi 1');
  	const result = await resolveAfter2Seconds();
  	console.log(result);
  	console.log('hi 2');
  	console.log('hi 3');
}

asyncCall();

Answer 2

您可以仅对promise使用wait，并且setTimeout函数不返回Promise。然而，你可以等待一个promise，这是解决使用setTimeout这样会给你想要的结果。

因此，函数执行将停止，直到被waited的promise得到解决或被拒绝，然后继续。

const test = async function() {
  console.log('hi 1');
         // return a new promise resolved after setTimeout callback is fired
  await (new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('timout1')
      resolve()
    }, 1000)
  }))
  console.log('hi 2');
  console.log('hi 3');
}

test()