10 # promise2 状态的处理

简介: 10 # promise2 状态的处理

下面继续上一节的,如果返回的是 promise 的情况:会采用 promise 的状态,决定下一步是走成功还是失败

具体可以参考这个:https://promisesaplus.com/

// promise 就是一个类
// 1. promise 有三个状态:成功态(resolve) 失败态(reject) 等待态(pending)(又不成功又不失败)
// 2. 用户自己决定失败的原因和成功的原因,成功和失败也是用户定义的
// 3. promise 默认执行器立即执行
// 4. promise 的实例都拥有一个 then 方法,一个参数是成功的回调,另一个是失败的回调
// 5. 如果执行函数时发生了异常也会执行失败的逻辑
// 6. 如果 promise 一旦成功就不能失败,反之亦然,只有等待态的时候才能去更新状态
const RESOLVE = "RESOLVE"; // 成功态
const REJECT = "REJECT"; // 失败态
const PENDING = "PENDING"; // 等待态
// 解析 promise
const resolvePromise = (promise2, x, resolve, reject) => {
    console.log("解析 promise----> promise2", promise2);
};
class KaimoPromise {
    constructor(executor) {
        this.status = PENDING;
        // value 是任意合法的 Javascript 值,(包括 undefined,thenable, promise)。
        this.value = undefined;
        // reason 是表示 promise 为什么被 rejected 的值
        this.reason = undefined;
        // 存放成功回调
        this.onResolveCallbacks = [];
        // 存放失败回调
        this.onRejectCallbacks = [];
        let resolve = (value) => {
            if (this.status === PENDING) {
                this.value = value;
                this.status = RESOLVE;
                this.onResolveCallbacks.forEach((fn) => fn());
            }
        };
        let reject = (reason) => {
            if (this.status === PENDING) {
                this.reason = reason;
                this.status = REJECT;
                this.onRejectCallbacks.forEach((fn) => fn());
            }
        };
        try {
            // 立即执行
            executor(resolve, reject);
        } catch (error) {
            // 处理错误异常
            console.log("inner---->", error);
            reject(error);
        }
    }
    // 1. promise 成功和失败的回调的返回值可以传递到外层的下一个 then
    // 2. promise 返回值情况
    //  2.1. 如果返回的是普通的值的话:传递到下一次的成功中(不是错误也不是 promise 就是普通值)
    //  2.2. 如果返回的是错误的情况:一定会走到下一次的失败中
    //  2.3. 如果返回的是 promise 的情况:会采用 promise 的状态,决定下一步是走成功还是失败
    // 3. 错误处理:如果离自己最近的 then 没有错误处理(没有写错误函数)会向下找
    // 4. 每次执行完 `promise.then` 方法后返回的都是一个新的 promise (promise 一旦成功或者失败都不能去修改状态)
    // promise 必须提供 then 方法来存取它当前或最终的值或者原因。
    // then 接收两个参数:onFulfilled 和 onRejected
    then(onFulfilled, onRejected) {
        // 实现链式调用
        let promise2 = new KaimoPromise((resolve, reject) => {
            if (this.status === RESOLVE) {
                // setTimeout 处理 promise2 没有初始化的问题, 需要等 executor 执行完
                setTimeout(() => {
                    // try catch 无法捕获异步代码,所以需要在 promise2 里面也加 try catch
                    try {
                        let x = onFulfilled(this.value);
                        // x 可能是一个 promise
                        resolvePromise(promise2, x, resolve, reject);
                    } catch (e) {
                        reject(e);
                    }
                }, 0);
            }
            if (this.status === REJECT) {
                setTimeout(() => {
                    try {
                        let x = onRejected(this.reason);
                        resolvePromise(promise2, x, resolve, reject);
                    } catch (e) {
                        reject(e);
                    }
                }, 0);
            }
            // 下面是异步的,可以不加setTimeout,统一一下加了一下
            if (this.status === PENDING) {
                this.onResolveCallbacks.push(() => {
                    setTimeout(() => {
                        try {
                            let x = onFulfilled(this.value);
                            resolvePromise(promise2, x, resolve, reject);
                        } catch (e) {
                            reject(e);
                        }
                    }, 0);
                });
                this.onRejectCallbacks.push(() => {
                    setTimeout(() => {
                        try {
                            let x = onRejected(this.reason);
                            resolvePromise(promise2, x, resolve, reject);
                        } catch (e) {
                            reject(e);
                        }
                    }, 0);
                });
            }
        });
        return promise2;
    }
}
module.exports = KaimoPromise;

测试:

const KaimoPromise = require("./10/kaimo-promise.js");
// 调用 p1.resolve() => p1.then(data)
//      p2.resolve() => p2.then(data)
let p1 = new KaimoPromise((resolve, reject) => {
    // resolve("kaimo666");
    reject("GG");
});
let p2 = p1.then(
    (data) => {
        console.log("p1---resolve--->", data);
        // return "kaimo777";
        // throw new Error()
        // 如果返回的是一个promise,promise 内部应该调用 then 方法拿到它成功的 okk,在向下传递
        return new KaimoPromise((resolve, reject) => {
            setTimeout(() => {
                resolve("okk");
            }, 1000);
        });
    },
    (err) => {
        return "失败";
    }
);
p2.then(
    (data) => {
        console.log("p2---resolve--->", data);
    },
    (err) => {
        return "失败";
    }
);

目录
相关文章
|
传感器 数据采集 算法
无线传感器网络(WSN)在物联网中的作用
【6月更文挑战第7天】物联网中的无线传感器网络(WSN)正加速发展,它由微型传感器节点组成,用于环境数据感知和传输。WSN助力实时监测(如农业、工业生产)、资源管理(能源和物流)、智能交通等领域,提供关键数据支持。Python代码示例展示了数据采集和传输过程。尽管面临能量限制和网络挑战,WSN在物联网中的角色不可或缺,将持续推动社会智能化和可持续发展。
527 2
|
存储 弹性计算 运维
阿里云无影云桌面精选特惠,4核8G配置新用户首购低至1元起
阿里云无影云桌面精选特惠,4核8G配置新用户首购低至1元起
762 0
|
8月前
|
存储 人工智能 监控
新手小白购买阿里云服务器省钱策略、配置选型与注意事项
针对初次使用阿里云服务器的用户,本文提供系统化的指导方案以优化成本并满足业务需求。首先介绍配置选型,包括实例类型(通用型、计算型、内存型)与基础配置建议;其次阐述省钱策略,如企业认证、合理选择计费模式及批量购买;最后提醒注意事项,涵盖带宽存储规划、地域网络优化及安全管理。新手可通过明确需求、选择配置、优化购买和持续监控四步快速上手,实现高效稳定的云端部署。 注:推荐配置基于2025年阿里云产品体系,具体信息请参考官网。
|
前端开发 API UED
Python后端与前端交互新纪元:AJAX、Fetch API联手,打造极致用户体验!
Python后端与前端交互新纪元:AJAX、Fetch API联手,打造极致用户体验!
246 2
|
SQL JavaScript 前端开发
Hive根据用户自定义函数、reflect函数和窗口分析函数
Hive根据用户自定义函数、reflect函数和窗口分析函数
192 6
|
安全 Devops 虚拟化
【专栏】虚拟化技术与云计算平台 OpenStack:硬件虚拟化、操作系统级虚拟化和容器化
【4月更文挑战第28天】本文探讨虚拟化技术原理,如硬件虚拟化、操作系统级虚拟化和容器化,以及开源云计算平台OpenStack如何利用这些技术提供优势。OpenStack支持多种虚拟化技术,具备开源灵活性、多租户架构、可扩展性、插件式设计和成本效益。未来,OpenStack将在容器化、DevOps、跨云策略和安全合规性方面发挥更大作用,助力企业数字化转型。
920 4
|
机器学习/深度学习 存储 计算机视觉
基于YOLOv8深度学习的西红柿成熟度检测系统【python源码+Pyqt5界面+数据集+训练代码】目标检测、深度学习实战
基于YOLOv8深度学习的西红柿成熟度检测系统【python源码+Pyqt5界面+数据集+训练代码】目标检测、深度学习实战
|
存储 编解码 自然语言处理
ELK技术栈 - logstash学习笔记(七)
ELK技术栈 - logstash学习笔记(七)
214 0
|
域名解析 安全 CDN
隐藏服务器真实IP的几种方法
隐藏服务器真实IP的几种方法
|
算法 数据挖掘 数据处理
基于SPSSPRO实现层次分析法(AHP)
层次分析法,简称AHP,是指将与决策总是有关的元素分解成目标、准则、方案等层次,在此基础之上进行定性和定量分析的决策方法。
511 0