简单理解ES6的async、await

以前项目中为了能较为优美、简洁地处理多个异步事件使用es6的async与await语法糖,但对其并未有深入的理解。现粗略了解与整理了一下,再次写下大概的理解:

1.async可以看做声明并返回了Promise对象; 

2.await相当于定义Promise内的方法, 必须在async中使用;

3.当await中的方法执行完毕或返回后执行后续代码。

例如下面表现函数执行顺序的代码:

async function async1(){
  console.log('async1 start')
  await console.log('async1 finish')
  console.log('async1 end')
}

async function async2(){
  await console.log('promise1')
  console.log('promise2')
}

setTimeout(() => {
  console.log('setTimeout')
}, 0);

async1();
async2();

执行代码打印结果如下:

 结果等同于

function async1(){
  console.log('async1 start')
  new Promise(function(resolve){
    console.log('async1 finish')
    resolve()
  }).then(()=>{
    console.log('async1 end')
  })
}

function async2(){
  new Promise(function(resolve){
    console.log('promise1')
    resolve()
  })
  .then(()=>{
    console.log('promise2')
  })
}

setTimeout(() => {
  console.log('setTimeout')
}, 0);

async1();
async2();

猜你喜欢

转载自www.cnblogs.com/neeter/p/12899959.html