重新炒一炒Promise(上）

喜欢ヅ旅行 2022-11-06 11:49 25阅读 0赞

# 创建未决的 Promise #

此构造器接受单个参数：一个被称为**执行器（executor** ）的函数，包含初始化 Promise 的代码。该执行器会被传递两个名为 resolve()与 reject() 的函数作为参数。

*  **resolve()** 函数在执行器成功结束时被调用，用于示意该Promise 已经准备好被决议（ resolved ），
 *  而 **reject()** 函数则表明执行器的操作已失败。

## 作业调度（ job scheduling ） ##

执行器会在 readFile() 被调用时**立即运行**。当 resolve() 或 reject() 在执行器内  
部被调用时，一个作业被添加到作业队列中，以便决议（ resolve ）这个 Promise 。  
![在这里插入图片描述][20210309111728819.png]

const pro = new Promise((res,rej)=>{ 
      console.log('我是Promise里面的')
      setTimeout(()=>{ 
        console.log('我是计时器里面的')
      },2000)
    })
    pro.then(function(val){ 
      console.log(val)
    },function(err){ 
      console.log(err)
    } )
    
    console.log("我是最外面的")

# Promise的生命周期 #

1.  pending ：挂起，表示未结束的 Promise 状态。相关词汇“挂起态”。
2.  fulfilled ：已完成，表示已成功结束的 Promise 状态，可以理解为“成功完成”。相关  
    词汇“完成”、“被完成”、“完成态”。
3.  rejected ：已拒绝，表示已结束但失败的 Promise 状态。相关词汇“拒绝”、“被拒  
    绝”、“拒绝态”。
4.  resolve ：决议，表示将 Promise 推向成功态，可以理解为“决议通过”，在 Promise  
    概念中与“完成”是近义词。相关词汇“决议态”、“已决议”、“被决议”。
5.  unsettled ：未决，或者称为“未解决”，表示 Promise 尚未被完成或拒绝，与“挂  
    起”是近义词。
6.  settled ：已决，或者称为“已解决”，表示 Promise 已被完成或拒绝。注意这与“已完  
    成”或“已决议”不同，“已决”的状态也可能是“拒绝态”（已失败）。
7.  fulfillment handler ：完成处理函数，表示 Promise 为完成态时会被调用的函数。
8.  rejection handler ：拒绝处理函数，表示 Promise 为拒绝态时会被调用的函数。

# Promise的状态 #

【PromiseState】

*  pending 未决定
 *  resolved / fullfilled 成功
 *  rejected 失败  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70]

# Promise对象的值 #

【PromiseResult】

*  reject
 *  resolve

# Promise-catch #

对错误结果进行处理  
![!\[在这里插入图片描述\](https://img-blog.csdnimg.cn/20210309111324424.png][https_img-blog.csdnimg.cn_20210309111324424.png]

# Promise-reject #

【【PromiseResult】】一定是rejected

1.  会抛出错误，可以用catch解决  
    ![在这里插入图片描述][20210309112552997.png]
2.  就算reject传入的是Promise对象中的成功函数返回结果都是失败的

![在这里插入图片描述][20210309112507224.png]

# 响应多个 Promise #

## Promise.all ##

1.  可迭代对象的元素都是 Promise ，只有在它们都完成后，所返回的 Promise 才会被完成。  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 1]
2.  若传递给 Promise.all() 的任意 Promise 被拒绝了，那么方法所返回的 Promise 就会立刻被  
    拒绝，而不必等待其他的 Promise 结束：

let p1 = new Promise((resolve, reject) => { 
        resolve('p1----')
      })
      let p2 = Promise.reject('p2-----')
      let p3 = Promise.resolve('p3-----')
      const res = Promise.all([p1, p2, p3])
      console.log(res)

![在这里插入图片描述][20210309134135159.png]

## Promise.race() ##

此方法也接受一个包含需监视的 Promise 的可迭代对象，并返回一个新的 Promise ，但一旦来源 Promise 中有一个被解决，所返回的 Promise 就会**立刻**被解决。  
![在这里插入图片描述][20210309134310845.png]

# Promise.then() #

then()的调用是对上一个Promise对象的resolve()或者reject()函数进行处理，并对其结果进行打印

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 2]

# Promise链中断 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 3]

# 利用Promise封装读取文件函数，可以多个文件读取 #

const fs = require('fs')
    // fs.readFile('./fs1.txt',(err,data)=>{ 
    // console.log(data.toString())
    // })
    function mineReadFile(path){ 
      return new Promise((resolve,reject)=>{ 
        fs.readFile(path,(err,data)=>{ 
          if (err){ 
            reject(err)
          }
          resolve(data.toString())
        })
      })
    } 
    mineReadFile('./fs1.txt').
    then((val)=>{ 
      console.log(val)
      return mineReadFile('./fs2.txt')
    }).then((val)=>{ 
      console.log(val)
      return mineReadFile('./fs3.txt')
    }).then((val)=>{ 
      console.log(val)
    })

# Promise封装ajax请求 #

const p = new Promise((resolve, reject) => { 
        //初始化
        const x = new XMLHttpRequest()
        //f发送请求
        x.open('Get', 'https://api.apiopen.top/getJoke')
        //发送请求
        x.send()
        x.onreadystatechange = function () { 
          if (x.readyState === 4) { 
            if (x.status >= 200 && x.status < 300) { 
              resolve(x.response)
            } else { 
              reject(x.status)
            }
          }
        }
    
      })

参考《深入理解ES6》

[20210309111728819.png]: /images/20221023/db5a0776108540bd83f8742713a9a33b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70]: /images/20221023/fb6c22eec5b3409096a005a8530c7113.png
[https_img-blog.csdnimg.cn_20210309111324424.png]: /images/20221023/260abcab00d245e19995c32cc162efc8.png
[20210309112552997.png]: /images/20221023/f8a3e428bdba49948d69b1b4a1619470.png
[20210309112507224.png]: /images/20221023/3da937e7cdc44d0bab5d1b51a249e412.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 1]: /images/20221023/cfc13789ba094143a6971d143f9186d3.png
[20210309134135159.png]: /images/20221023/01b14124bab0404793379314b8a05504.png
[20210309134310845.png]: /images/20221023/f46992d3af4a4146a41cfff9a22e05c6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 2]: /images/20221023/7676a8c97c134808a4fbe7c8eb84f4dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTUxMTIzNg_size_16_color_FFFFFF_t_70 3]: /images/20221023/d7e954e50b0548b39a3ed5607cfdac80.png