手写Promise，在编程世界里谱写你的承诺

前端

2023-01-21 19:12:58

掌握手写 Promise，解锁异步编程新境界

作为一名程序员，你是否常常被异步编程的复杂性所困扰？在 JavaScript 的世界里，Promise 应运而生，为我们处理异步操作提供了优雅而强大的方式。手写 Promise，不仅是一种编程技巧，更是一把打开异步编程之门的钥匙。

什么是 Promise？

Promise，直译为“承诺”，是一种 JavaScript 对象，用于处理异步操作。它提供了一种简单明了的方法，使代码更加易读和可维护。Promise 有三种状态：

进行中：异步操作正在进行。
已完成：异步操作已成功完成。
已拒绝：异步操作失败。

为什么手写 Promise？

手写 Promise，绝不仅仅是为了炫技。它能让你深入了解 JavaScript 的异步机制，提升你的编程功底。通过手写 Promise，你可以：

拆解异步操作，理解其执行流程。
掌控 JavaScript 运行机制，提高代码的可控性。
增强你的编程技能，为项目和面试增添砝码。

手把手教你手写 Promise

1. 定义 Promise 构造函数

function Promise(executor) {
  this.state = 'pending';
  this.value = undefined;
  this.reason = undefined;
  this.onFulfilledCallbacks = [];
  this.onRejectedCallbacks = [];

  try {
    executor(resolve, reject);
  } catch (error) {
    reject(error);
  }
}

2. 定义 then 方法

Promise.prototype.then = function(onFulfilled, onRejected) {
  // ...
};

3. 定义 resolve 和 reject 方法

Promise.prototype.resolve = function(value) {
  // ...
};

Promise.prototype.reject = function(reason) {
  // ...
};

实战演练

以下是一个手写 Promise 的实战示例：

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('操作已成功！');
  }, 2000);
});

myPromise.then((result) => {
  console.log(result);  // 输出：操作已成功！
});