04async await

async

async 函数返回值是一个promise对象，promise对象的状态由async函数的返回值决定

 

//函数的三种定义
async function hello() { return "Hello" };
let hello = async function() { return "Hello" };
let hello = async () => { return "Hello" };

//使用
hello().then((value) => console.log(value))
hello().then(console.log) //简写

async函数返回值决定了返回的promise的状态

async function fn() {
  //  throw 1 走catch
  //  return Promise.reject(1) 走catch
   
  return 2 //走then
  return Promise.resolve(2) //走then
  return undefined  //默认返回 走then
} 

await 

await  操作符用于等待一个Promise 对象。它只能在异步函数 async function 中使用。

[return_value] = await expression;

expression 表示一个 Promise 对象或者任何要等待的值。

返回值:返回 Promise 对象成功的value。如果等待的不是 Promise 对象，则返回该值本身

function fn3() {
  return Promise.resolve(3)
}


const fn4 = async () => {
  console.log(1); //第一步
  const res = await fn3() //await右边是promise对象，得到的结果是promise成功的value值
  console.log('res: ', res); //第三步
}
let res=fn4()

console.log(2); //第二步


async function fn5(){
  const data=await 30 //await右边不是promise，得到的结果是塔本身，即右边的值
  console.log('data: ', data);//30

}
fn5()

 

try-catch

function fn3() {
  return Promise.reject(3)
}


const fn4 = async () => {
  console.log(1); //第一步
  try {
    const res = await fn3() //await右边是promise对象，得到的结果是promise成功的value值
    console.log('res: ', res); //第三步

  } catch (error) {
    console.log('error: ', error);//3 promise失败的状态值

  }

}
fn4()

 

async await阻塞失效问题

//await 阻塞失效
async function fn() {
  await setTimeout(() => {
    console.log(1);
  }, 2000)
  console.log(2);
}
fn()

//await 阻塞成功
async function fn1() {
  await new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(1);
      resolve();
    }, 2000)
  })
  console.log(2);
}
fn1()