JavaScript的Promise源码解析

迷途小码农零零发

已于 2024-12-19 11:34:18 修改

阅读量654

点赞数 3

CC 4.0 BY-SA版权

分类专栏：前端知识库文章标签： javascript 前端开发语言

于 2024-09-23 09:57:11 首次发布

本文链接：https://blog.csdn.net/yiguoxiaohai/article/details/142450831

在 JavaScript 中，Promise 是一种用于处理异步操作的对象，它提供了一种更优雅的方式来处理异步代码，避免了回调地狱的问题。下面是对 JS 的 Promise 源码的详细解析：

一、Promise 的基本结构

一个 Promise 对象主要包含以下几个部分：

状态：Promise 有三种状态，分别是 pending（等待中）、fulfilled（已成功）和 rejected（已失败）。初始状态为 pending，一旦状态确定就不可再改变。
值：当 Promise 状态变为 fulfilled 时，会有一个值与之对应；当状态变为 rejected 时，会有一个原因（reason）与之对应。
回调函数队列：分别用于存储当 Promise 状态变为 fulfilled 或 rejected 时要执行的回调函数。

以下是一个简单的 Promise 实现框架：

function Promise(executor) {
   
   
  const self = this;
  self.status = "pending";
  self.value = undefined;
  self.reason = undefined;
  self.onResolvedCallbacks = [];
  self.onRejectedCallbacks = [];

  function resolve(value) {
   
   
    if (self.status === "pending") {
   
   
      self.status = "fulfilled";
      self.value = value;
      self.onResolvedCallbacks.forEach((fn) => fn());
    }
  }

  function reject(reason) {
   
   
    if (self.status === "pending") {
   
   
      self.status = "rejected";
      self.reason = reason;
      self.onRejectedCallbacks.forEach((fn) => fn());
    }
  }

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