async/await 异步函数

1、async异步函数的使用

// await/async写法
async function foo1() {}

const foo2 = async () => {};

2、async异步函数的执行流程

// 都是同步代码，跟普通函数代码没区别
async function foo() {
  console.log("内部代码执行1");
  console.log("内部代码执行2");
  console.log("内部代码执行3");
}

console.log("script start");
foo();
console.log("script end");

3、async异步函数和普通函数的区别1 - 返回值

// 异步函数的返回值一定是个Promise
async function foo() {
  console.log("foo start...");
  // 1、如果默认不写，默认返回的是undefined

  // 2、返回一个值
  // return "aaa";

  // 3、返回一个thenable
  // return {
  //   then: function (resolve, reject) {
  //     resolve("haaaaaa");
  //   },
  // };

  // 4、返回一个Promise
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve("hehehehhehe");
    }, 2000);
  });
}

const promise = foo();
// 这个then是在foo()有return的时候才会被执行，而且是被加到微任务队列里面的
promise.then((res) => {
  console.log(res);
});

4、async异步函数和普通函数的区别2 - 异常

async function foo() {
  console.log("foo function start~");
  console.log("中间代码");

  // 异步函数中的异常，会被作为异步函数返回的Promise的reject值的，可以在catch中拿到错误信息
  throw new Error("error Message~");

  console.log("foo function end");
}

foo().catch((err) => {
  console.log('chen', err);
});
console.log("后续还有代码~");

5、async中使用await

// async function foo() {
//   await 表达式(Promise)
// }

// 1、await跟上表达式
// function requestData() {
//   return new Promise((resolve, reject) => {
//     setTimeout(() => {
//       resolve(111);
//     }, 1000);
//   });
// }
// async function foo() {
//   // 什么时候返回res -> 就是requestData()调用resolve的时候
//   const res = await requestData();

//   // 这些后面的代码，相当于await requestData();中Promise then中执行的。
//   console.log('res', res);
//   console.log("=============");
// }
// foo();


function requestData() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      reject(111);
    }, 1000);
  });
}
// 2、跟上其他的值
async function foo() {
  // 2.1、await 跟上普通值，它会立即返回
  // const res1 = await 123;

  // 2.2、await跟上对象
  // const res1 = await {
  //   then: function (resolve, reject) {
  //     resolve("aaaaaaa");
  //   },
  // };

  // 2.3、await跟上Promise
  // const res1 = await new Promise((resolve) => {
  //   resolve("bbbb");
  // });
 

  // 2.4、reject值，当我们这里面reject的时候，reject的值，会作为整个异步函数foo()的Promise的reject的值，我们需要在外面catch
  const res1 = await requestData();
   console.log("res", res1);
}
foo().catch((err) => {
  console.log('err---', err);
})