Promise

Promise的基本使用

Promise 用来干什么？

1、主要用于异步计算
2、可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果
3、可以在对象之间传递和操作promise，帮助我们处理队列

Promises可以解决我们以前在开发中遇到的什么问题？

• 之前处理异步是通过纯粹的回调函数的形式进行处理
• 很容易进入到回调地狱中，剥夺了函数return的能力
• 问题可以解决，但是难以读懂，维护困难
• 稍有不慎就会踏入回调地狱 - 嵌套层次深，不好维护

promise 是什么怎么去用？

Promise是本身是一个对象，通常我们在解决一个异步的问题时，我们需要先创建Promise对象，即new Promise()在创建的Promise的对象中，可以传递一个回调函数callback ，这callback在new Promise 时会自动自行里面的这个回调函数。注意：回调函数中，可以根绝编码时的业务需要，可以传递两个可选传的两个参数（resolve，reject）这两个可选传的参数本身是两个函数。回调函数中我们就可以定义自己需要执行的异步操作的任务了，这里我们以平时用得最多的设置定时的方式来开启模拟一个异步任务。当在任务执行完后如果，执行完成后，一般规定俗成的是，异步任务完成成功后，我们调用 resolve方法，之后会走.then() 方法如果执行异步任务，我们需要抛出错误信息执行reject() 方法。 后面走.catch()的方法。

这里还有一个细节的问题是，如果不想用.catch() 的方法获取reject方法传递过来的错误信息的方式的话，也可以通过.then()中传递第二个回调函数的方式，获取错误信息，具体说明，如下所示的代码：

//  promise调用方式一：
new Promise((resolve, reject) => {
        setTimeout(() => {
          reject('error message') // 注意：resolve和reject方法谁先执行，就走对应的then，或者catch方法
          resolve('success')
        }, 2000)
      })
        .then((data) => {
          console.log(data)
        })
        .catch((data) => {
          console.log(data)
        })


// promise调用方式二：

 new Promise((resolve, reject) => {
        setTimeout(() => {
          reject('error message') // 注意：resolve和reject方法谁先执行，就走对应的then，或者catch方法
          resolve('success')
        }, 2000)
      }).then(
        (data) => {
          console.log(data)
        },
        (err) => {
          console.log(err)  // 通过传递第二个回调函数的方式，这里就是调用的reject的方法后会执行这里
        }
      )

promise里面的可以简便调用书写的应用场景

这里我们假设一个应用的场景进行说明演示

通过Promise的方式，对数据进行三次的封装操作

new Promise((resolve) => {
        setTimeout(() => {
          resolve('aaaa')
        }, 1000)
      })
        .then((data) => {
          console.log(data, '这是第一轮获取的结果')
          return new Promise((resolve) => {
            resolve(data + 1111)
          })
        })
        .then((data) => {
          console.log(data, '这是第二轮获取的结果')
          return new Promise((resolve) => {
            resolve(data + 222)
          })
        })
        .then((data) => {
          console.log(data, '这是第三轮获取的结果')
        })


   
new Promise((resolve) => {
        setTimeout(() => {
          resolve('aaaa')
        }, 1000)
      })
        .then((data) => {
          console.log(data, '这是第一轮的结果')
          return Promise.resolve(data + 111)  //如果是只想单纯的通过resolve的方法返回结果出去，这里就可以直接调用Promise的resolve的方法传值，，如果是想返回错误信息就可以直接 return Promise.reject('错误信息')  这种就可以通过后面的.catch()接收到
        })
        .then((data) => {
          console.log(data, '这是第二轮的结果')
          return Promise.resolve(data + 2222)
        })
        .then((data) => {
          console.log(data, '这是第三轮结果')
        })


new Promise((resolve) => {
        setTimeout(() => {
          resolve('aaaa')
        }, 1000)
      })
        .then((data) => {
          console.log(data, '这是第一轮的结果')
          return data + 111  //也可以直接return 成功的信息，如果直接传递错误信息则直接throw '错误信息'
        })
        .then((data) => {
          console.log(data, '这是第二轮的结果')
          return data + 2222
        })
        .then((data) => {
          console.log(data, '这是第三轮结果')
        })

Promise.all() 方法的使用

当我们需要在几个异步程序全部执行完之后，统一的对异步操作执行完后的数据进行集中的处理时，我们可以使用Promise.all

Promise.all() 里面需要传递一个数组作为参数，数组中传递Promise对象作为进行异步调用.then(data) 方法中的中的数据是所有通过resolve中返回出来的数据

 Promise.all([
        new Promise((resolve, reject) => {
          setTimeout(() => {
            resolve('弹药已经准备好')
          }, 1000)
        }),

        new Promise((resolve) => {
          setTimeout(() => {
            resolve('点火已就绪')
          }, 2000)
        }),
      ]).then((result) => {  // 这里接收的result就是一个数组对象里面保存的就是resolve方法传递过来的值
        console.log(result[0])
        console.log(result[1])
        console.log('准备发射，打他娘的小日本')
      })