Promise 的使用

为什么需要 Promise

异步操作的解决方案

在函数内有一个异步操作

function request() {
    // 模拟异步操作
    setTimeout(() => {
      // 异步执行代码
      ...
    }, 3000);
}

// 调用函数
request()

通常我们会有以下需求：

• 获取到异步操作的结果；

• 异步操作结束后执行其他的操作；

这时候我们的解决思路是，定义一个回调函数，在异步操作执行结束后调用

function request(..., callback) {
    // 模拟异步操作
    setTimeout(() => {
      // 异步执行代码
      
      // 回调函数   
      callback()
    }, 3000);
}

在调用函数时传递回调函数

request(() => {
    console.log('异步执行结束了');
})

如何使用 Promise

Promise 的基本使用

1. 实例化一个 Promise 对象

const promise = new Promise((reslove, reject) {
    // 成功执行
    reslove()
    // 失败执行
    reject()
})

2. then 方法

// then 方法传入两个回调函数
// 第一个回调函数会在 Promise 执行 resolve 函数时被回调
// 第二个回调函数会在 Promise 执行 reject 函数时被回调
promise.then(() => {}, () => {})

Promise 的状态

Promise 对象的状态值有三种

• pending
• fulfilled
• rejected

new Promise((reslove, reject) => {
    ...
    // pending 待定

    reslove()
    // fulfilled 已完成
    
    reject()
    // rejected 已拒绝
}).then(() => { 

}, () => { 

}) 

• 默认是 pending 状态，执行 reslove 方法之后就变成 fulfilled 状态，执行 reject 方法之后就变成 rejected 状态。

• Promise 的状态一旦确定下来就不能更改了，所以 reslove 方法跟 reject 方法只会触发一个。

• 只有当 Promise 的状态变成 fulfilled 时才会触发 then 方法的第一个回调函数， rejected 状态同理。

reslove 方法传参

1. 参数是常用数据类型

pending —> fulfilled

2. 参数是一个 Promise 对象

这时状态值不会直接变成 fulfilled，而是由传入的 Promise 决定，相当于状态进行了移交。

3. 参数是一个对象，且对象有 then 方法

会直接执行对象的 then 方法，在 then 方法里来决定 Promise 的状态。

Promise 的对象方法

then 方法

• 参数：回调函数
• 返回值：Promise 对象

const  promise = new Promise((reslove, reject) => {
  let data
  reslove(data)
})

promise.then((data) => {
  console.log(data)
}) 

catch 方法

finally 方法

Promise 的类方类

reslove/reject

all/