JavaScript Promise 核心概念与常用方法详解

Promise 是 JavaScript 中用于处理异步操作的一种对象化解决方案。它通过提供统一的接口来获取异步操作的结果，显著改善了传统异步编程的复杂性，有效避免了回调地狱（Callback Hell）问题。相比传统的回调函数和事件机制，Promise 提供了更合理且强大的控制流管理方式。

从语法层面看，Promise 是一个封装了异步操作消息的对象。它提供了一套统一的 API 规范，使得不同类型的异步操作都可以采用一致的方法进行处理，简化了代码结构。

Promise 实例的生命周期包含三种状态：

（1）Pending（进行中）：初始状态，表示异步操作尚未完成。

（2）Resolved（已完成）：操作成功完成，状态变为已解决。

（3）Rejected（已拒绝）：操作失败或被拒绝，状态变为已拒绝。

Promise 实例的状态转换过程主要涉及两种路径：

（1）从 Pending 状态转换为 Resolved 状态，表示操作成功。

（2）从 Pending 状态转换为 Rejected 状态，表示操作失败。

需要注意的是，一旦 Promise 的状态从 Pending 转换为 Resolved 或 Rejected，该状态将不可逆，无法再次更改。

Promise 的基本使用方式如下：

1、创建 Promise 对象：

Promise 对象代表一个异步操作，其生命周期包含三种状态：Pending（进行中）、Resolved（已成功）和 Rejected（已失败）。

Promise 构造函数接收一个执行函数作为参数，该执行函数包含两个参数：resolve 和 reject。resolve 用于将状态从 Pending 转为 Resolved，reject 用于将状态从 Pending 转为 Rejected。

2、Promise 的常用方法：

Promise 提供了五个常用的静态或实例方法：

（1）then()：

then 方法接收两个可选的回调函数作为参数。第一个回调函数在 Promise 状态变为 Resolved 时调用，接收处理结果；第二个回调函数在状态变为 Rejected 时调用，接收错误信息。第二个参数可以省略，若省略则无需处理拒绝状态。

let promise = new Promise((resolve,reject)=>{
    ajax('first').success(function(res){
        resolve(res);
    })
})
promise.then(res=>{
    return new Promise((resovle,reject)=>{
        ajax('second').success(function(res){
            resolve(res)
        })
    })
}).then(res=>{
    return new Promise((resovle,reject)=>{
        ajax('second').success(function(res){
            resolve(res)
        })
    })
}).then(res=>{
 })

（2）catch()：

catch 方法的功能等同于 then 方法的第二个参数，专门用于处理 Promise 状态变为 Rejected 时的回调逻辑。

此外，catch 还用于捕获前序链式调用中 resolve 回调函数执行时抛出的异常。如果发生错误，程序不会中断，而是直接进入 catch 方法进行处理，确保错误可控。

p.then((data) => {
     console.log('resolved',data);
},(err) => {
     console.log('rejected',err);
     }
); 
p.then((data) => {
    console.log('resolved',data);
}).catch((err) => {
    console.log('rejected',err);
});

（3）all()：

all 方法用于并行执行多个任务，接收一个包含多个 Promise 对象的数组作为参数。只有当数组中所有 Promise 对象的状态都变为 Resolved 时，all 方法返回的 Promise 状态才会变为 Resolved，并返回所有结果组成的数组。如果其中任意一个 Promise 状态变为 Rejected，则 all 方法返回的 Promise 状态立即变为 Rejected。

javascript
let promise1 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
       resolve(1);
	},2000)
});
let promise2 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
       resolve(2);
	},1000)
});
let promise3 = new Promise((resolve,reject)=>{
	setTimeout(()=>{
       resolve(3);
	},3000)
});
Promise.all([promise1,promise2,promise3]).then(res=>{
    console.log(res);
    //结果为：[1,2,3] 
})

（4）race()：

race 方法与 all 类似，接收一个包含多个 Promise 对象的数组。不同之处在于，race 方法返回的 Promise 状态取决于数组中第一个完成（无论是 Resolved 还是 Rejected）的 Promise 对象。一旦有任务完成，race 方法立即返回该结果。

race 的实际应用场景包括实现超时控制：当某个操作超过指定时间仍未完成时，可以通过 race 方法结合超时 Promise 来终止等待或执行备用逻辑。

Promise.race([promise1,timeOutPromise(5000)]).then(res=>{})

（5）finally()：

finally 方法用于指定无论 Promise 最终状态是 Resolved 还是 Rejected，都会执行的操作。该方法在 ES2018 标准中被引入。

promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});

finally 方法的回调函数不接受任何参数，因此无法直接得知前序 Promise 的状态是成功还是失败。这意味着开发者无法在 finally 中区分处理结果，只能执行通用的清理或后续操作。

promise
.finally(() => {
  // 语句
});
// 等同于
promise
.then(
  result => {
    // 语句
    return result;
  },
  error => {
    // 语句
    throw error;
  }
);

在不使用 finally 方法的情况下，若需对成功和失败两种情况执行相同的清理逻辑，必须分别编写两次代码。引入 finally 后，只需编写一次即可覆盖所有状态，简化了代码结构。

总结

本文介绍了 Promise 的核心概念与常用方法，希望能为读者提供有价值的参考。欢迎持续关注本站，获取更多技术内容！