浅谈JavaScript中promise及其应用

        Promise是一种非常常见的异步编程解决方案， promise是一个构造函数可以使得我们更加高效地管理异步代码。Promise主要是用来解决回调地狱的问题，让代码更加清晰易懂，同时也可以让我们更好地处理异步操作的返回值。

        这里可能有人会问到了，回调地狱是什么？简单来说回调地狱就可以理解为当我们需要处理多个异步操作时，会出现多层嵌套的回调函数，这种嵌套的结构可读性非常差，也很难维护，这种情况就被称为回调地狱。

        为了避免回调地狱，我们可以使用Promise来解决这个问题，Promise可以让我们更加清晰地处理异步操作的结果，避免嵌套的回调函数。

        Promise

        Promise的基本用法是通过new Promise()来创建一个Promise对象，然后通过传入的函数来处理异步操作，最后通过resolve()或reject()来返回异步操作的结果。比如下面的代码：

new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Hello, Promise!');
  }, 1000);
}).then((result) => {
  console.log(result);
});

        上面的代码中，我们通过new Promise()来创建了一个Promise对象，然后通过setTimeout()来模拟一个异步操作，1秒后通过resolve()来返回异步操作的结果。最后通过.then()方法来处理异步操作的返回值，输出结果为'Hello, Promise!'。

        Promise具有三种状态：pending（进行中），fulfilled（已成功），rejected（已失败）

        缺点：

                当Promise一旦创建就无法再取消Promise，一旦新建就会立即执行

                不设置回调函数，Promise内部抛出错误

        实例生成之后，可以用then方法指定fulfilled状态和rejected状态，当调用resolve()方法时，任务进入fulfilled状态进行执行，否则进入rejected状态

<script>
      console.log("a");
      setTimeout(() => console.log("b"));//宏任务
      let p = new Promise((resolve, reject) => {//执行器函数
        resolve();//异步任务已经完成           
        console.log("c");//同步任务
      }).then(() => {  //两个参数易个成功一个失败 onfulfilled onrejected
        console.log("d");//异步微任务
      });
      console.log("e");  //acedb
</script>

        这段代码中，先从上到下依次执行代码，主线程执行过程如下：执行console.log("a")，输出a。执行setTimeout(() => console.log("b"))，将该任务放入宏任务队列中等待执行。执行new Promise()，创建一个Promise对象，执行器函数内部的代码被立即执行，即执行resolve()和console.log("c")。注意，resolve()是异步任务，会被放入微任务队列中等待执行，而console.log("c")是同步任务，会直接输出c。执行console.log("e")，输出e。当前宏任务执行完毕，主线程检查微任务队列，发现有一个resolve()，执行resolve()，将then()中的回调函数console.log("d")放入微任务队列中等待执行。微任务队列中只有console.log("d")一个任务，执行该任务，输出d。执行完所有微任务后，主线程继续检查宏任务队列，发现有一个setTimeout(() => console.log("b"))，执行该任务，输出b。

        因此，最终输出结果为：a c e d b。

        有人会问宏任务微任务是什么呢？

      宏任务和微任务        

        JavaScript中的宏任务和微任务是指代码执行时所遇到的两种不同的任务类型。

        宏任务是指由浏览器或Node.js引擎所维护的任务队列中的任务，比如setTimeout、setInterval、setImmediate、I/O操作等，这些任务会被分配到不同的队列中，等待主线程空闲时执行。

        微任务是指由Promise、Object.observe、MutationObserver等所注册的任务，它们会被放在一个队列中，在当前宏任务执行完毕后立即执行。

        Promise高级用法promise.all()

        Promise.all()可以接收一个Promise数组作为参数，当所有的Promise对象都成功时就会返回Promise.all()才会返回成功的结果，如果有一个Promise对象失败了，那么Promise.all()就会返回失败的结果。比如下面的代码：

Promise.all([
  new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Promise 1');
    }, 1000);
  }),
  new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Promise 2');
    }, 2000);
  }),
  new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Promise 3');
    }, 3000);
  })
]).then((results) => {
  console.log(results);
});

        上面的代码中，我们通过Promise.all()来处理三个异步操作，当三个异步操作都完成时，Promise.all()才会返回结果，输出结果为['Promise 1', 'Promise 2', 'Promise 3']。

        总之，Promise是一种非常有用的异步编程解决方案，它可以让我们更加高效地管理异步代码，避免回调地狱的问题，同时也可以让我们更好地处理异步操作的返回值。在实际开发中，我们可以根据具体情况选择合适的Promise方法来处理异步操作，从而使得我们的代码更加简洁、易懂。