58.异步演进从Promise到async/await

day10:1.以下代码会同时输出

//模拟一个异步的代码
setTimeout(() => {
  console.log("settimeout1");
}, 1000);
setTimeout(() => {
  console.log("settimeout2");
}, 1000);

2.如果想要2在1之后并且在1秒钟之后输出->这就是所说的回调地狱的问题，看起来很麻烦，而且层层嵌套

setTimeout(() => {
  console.log("settimeout1");
  setTimeout(() => {
    console.log("settimeout2");
  }, 1000);
}, 1000);

3.使用promise进行改进，使用链式调用的方式-》在第一个promise结果里面返回下一个异步代码快就可以

let promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    console.log("第1个异步代码");
    resolve("promise1 resolve->第1个异步代码");
  }, 1000);
});
promise1
  .then((res) => {
    console.log(res);
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("第2个异步代码");
        resolve("promise2 resolve->第2个异步代码");
      }, 1000);
    });
  })
  .then((res) => {
    console.log(res);
  })
  .catch((err) => {
    console.log(err);
  });

3.1若想第一个返回报错之后后面的不往下执行

let promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    console.log("第1个异步代码");
    reject("promise1 reject->第1个异步失败代码"); //第一种：使用reject
  }, 1000);
});
promise1
  .then((res) => {
    console.log(res);
    //第二种：使用抛出异常的方式
    throw new TypeError("there is somthing wrong");
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("第2个异步代码");
        resolve("promise2 resolve->第2个异步代码");
      }, 1000);
    });
  })
  .then((res) => {
    console.log(res);
  })
  .catch((err) => {
    console.log(err);
  });

4.promise异步演async和await
插一句：async中不一定要有await但是用await必须要写async

async function testAsync() {
  let res1 = await new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("第1个异步代码");
      resolve("promise1 resolve->第1个异步代码");
    }, 1000);
  });
  console.log(res1);
  let res2 = await new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("第2个异步代码");
      resolve("promise2 resolve->第2个异步代码");
    }, 1000);
  });
  console.log(res2);
}
testAsync();

这个时候代码看起来就很想同步代码的执行了，但是在testAsync函数前后写同步代码会发生什么事情呢？

testAsync();
console.log("========================");

此时会发现分割线代码会先执行，然后再执行testAsync函数，这是为什么呢？
因为testAsync、console都是同步代码，在执行到testAsync执行栈的时候会注册一个微任务。此时promise会被放入待执行队列中，等到所有的同步代码，也就是console执行完之后，事件循环机制查找到任务队列中还有异步任务没有执行时这时才开始执行异步任务。