美文网首页
手写Promise核心代码

手写Promise核心代码

作者: 江火渔枫 | 来源:发表于2022-05-07 23:38 被阅读0次
const { reject } = require("core-js/fn/promise");

class Commitment {

    static PENDING = '待定';
    static FULFILLED = '成功';
    static REJECTED = '拒绝';

    constructor(func){
        this.status = Commitment.PENDING;
        this.result = null;
        this.resolveCallbacks = [];
        this.rejectCallbacks = [];
        //***bind(this) 将this指向新创建的对象 commitment ****/
        //func(this.resolve.bind(this), this.reject.bind(this));

        //原生promise调用than 可以把错误的信息做为内容输出出来 调用方式如下
        /***
         * let promise = new Promise((resolve, reject) => {
         *  throw new Error('输出错误信息');
         * })
         * ** */
        try{
            func(this.resolve.bind(this), this.reject.bind(this));
        } catch (error){
            //这里是直接执行不是创建实例后再执行 不用绑定this
            this.reject(error);
        }
    }

    resolve(){
        setTimeout(() => {
            if(this.status === Commitment.PENDING){
                this.status = Commitment.FULFILLED;
                this.result = result;
                this.resolveCallbacks.forEach(callback =>{
                    callback(result)
                })
            }
        });
    }
    reject(){
        setTimeout(() => {
            if(this.status === Commitment.PENDING){
                this.status = Commitment.REJECTED;
                this.result = result;
                this.rejectCallbacks.forEach(callback => {
                    callback(result)
                })
            }
        });
    }
    than(onFULFILLED, onREJECTED){
        //为实现 .than链式调用  方法内返回new Commitment
        return new Commitment((resolve, reject) => {
            // than 里面的两个参数不是函数则不被执行
            //解决思路 赋值空函数
            onFULFILLED = typeof onFULFILLED === 'function' ? onFULFILLED : () => {};
            onREJECTED = typeof onREJECTED === 'function' ? onREJECTED : () => {};
            if(this.status === Commitment.PENDING){
                this.resolveCallbacks.push(onFULFILLED);
                this.rejectCallbacks.push(onREJECTED);
            }
            if(this.status === Commitment.FULFILLED){
                onFULFILLED(this.result);
            }
            if(this.status === Commitment.REJECTED){
                onREJECTED(this.result);
            }
        })
    }
}

let commitment = new Commitment((resolve, reject) => {
    resolve('这次一定');
});
commitment.than(
    result => {console.log(result)},
    result => {console.log(result.message)}
).than(
    result => {console.log(result)},
    result => {console.log(result.message)}
);

代码执行流程图

https://www.bilibili.com/video/BV1RR4y1p7my?spm_id_from=333.337.search-card.all.click

相关文章

  • 手写Promise核心代码

    https://www.bilibili.com/video/BV1RR4y1p7my?spm_id_from=3...

  • Promise 手写代码思路

  • 手写promise

    promise 手写 代码来源:darrell-wheels promise 30分钟,带你实现一个符合规范的 P...

  • 手写Promise

    手写 Promise 我们会通过手写一个符合 Promise/A+ 规范的 Promise 来深入理解它,并且手写...

  • 手写 Promise 系列 --- 3

    在前两篇(手写 Promise 系列 --- 1)和(手写 Promise 系列 ---2) 中,达成了3个目标 ...

  • 手写Promise

    $ 正常的promise用法   $ 手写的Promise   # 测试可行性

  • 手写promise

    手写promise 带大家手写一个 promis。在手写之前我会先简单介绍一下为什么要使用promise、prom...

  • 手写一个Promise

    写在前面 如果本文对您有所帮助,就请点个关注吧! 手写一个Promise 源代码

  • 纯手写实现自己的nodejs promise 库

    纯手写实现自己的nodejs promise 库什么是Promise?promise 链Async/Await后续...

  • 手写基础 promise

    1. 前言 玩下吧 手写 promise,看看能写成啥样 2. promise 基础结构 3. 手写`promi...

网友评论

      本文标题:手写Promise核心代码

      本文链接:https://www.haomeiwen.com/subject/kvzoyrtx.html