ES6 Promise then方法链式调用原理与实战

作者:代码拾荒

时间:2026-10-22

浏览:405

本文深入解析ES6中Promise对象的then方法链式调用机制。通过代码示例说明then返回新Promise实例的特性,以及前一个回调返回Promise时后续调用的等待逻辑,帮助开发者掌握异步操作的优雅写法。

文章目录

Promise链式调用基础

Promise通常被称为链式调用,它是ES6标准中最为关键的特性之一。

简而言之,它允许在异步操作完成后,通过不断调用then方法来嵌套执行回调函数,这种通过链式方式执行回调的操作模式即被称为Promise。

then()方法用于为Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数。该方法会返回一个新的Promise实例,因此可以在then()方法后继续链式调用另一个then()方法。

then方法链式调用示例


let p = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'success');
});
p.then(
  res => {
    console.log(res);
    return `${res} again`;
  }
)
  .then(
    res => console.log(res)
  );
// 连续
// success
// success again

然而,如果前一个then()方法的回调函数中返回的是一个Promise实例,那么后续then()方法中的回调函数将等待前一个Promise实例状态发生变化后才会被调用。

返回Promise的链式调用


let p = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'success');
});
p.then(
  res => {
    console.log(res);
    return new Promise((resolve, reject) => {
      setTimeout(resolve, 1000, 'success');
    });
  }
)
  .then(
    res => console.log(res)
  );
// 相隔1000ms
// success
// success

以上内容涵盖了本文的核心要点,希望能对读者的学习有所助益,同时也欢迎大家继续支持本站。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章