手写Promise A+ 规范

基于ES6语法手写promise A+ 规范,源码实现

class Promise {
    constructor(excutorCallBack) {
        this.status = ‘pending‘;
        this.value = undefined;
        this.fulfilledAry = [];
        this.rejectedAry = [];

        //=>执行EXCUTOR(异常捕获)
        let resolveFn = result => {
            let timer = setTimeout(() => {
                clearTimeout(timer);
                if (this.status !== ‘pending‘) return;
                this.status = ‘fulfilled‘;
                this.value = result;
                this.fulfilledAry.forEach(item => item(this.value));
            }, 0);
        };
        let rejectFn = reason => {
            let timer = setTimeout(() => {
                clearTimeout(timer);
                if (this.status !== ‘pending‘) return;
                this.status = ‘rejected‘;
                this.value = reason;
                this.rejectedAry.forEach(item => item(this.value));
            }, 0);
        };
        try {
            excutorCallBack(resolveFn, rejectFn);
        } catch (err) {
            //=>有异常信息按照REJECTED状态处理
            rejectFn(err);
        }
    }

    then(fulfilledCallBack, rejectedCallBack) {
        //=>处理不传递的状况
        typeof fulfilledCallBack !== ‘function‘ ? fulfilledCallBack = result => result : null;
        typeof rejectedCallBack !== ‘function‘ ? rejectedCallBack = reason => {
            throw new Error(reason instanceof Error ? reason.message : reason);
        } : null;

        //=>返回一个新的PROMISE实例
        return new Promise((resolve, reject) => {
            this.fulfilledAry.push(() => {
                try {
                    let x = fulfilledCallBack(this.value);
                    x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                } catch (err) {
                    reject(err);
                }
            });
            this.rejectedAry.push(() => {
                try {
                    let x = rejectedCallBack(this.value);
                    x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                } catch (err) {
                    reject(err);
                }
            });
        });
    }

    catch(rejectedCallBack) {
        return this.then(null, rejectedCallBack);
    }

    static all(promiseAry = []) {//=>Promise.all()
        return new Promise((resolve, reject) => {
            //=>INDEX:记录成功的数量 RESULT:记录成功的结果
            let index = 0,
                result = [];
            for (let i = 0; i < promiseAry.length; i++) {
                //=>promiseAry[i]:
                //每一个需要处理的PROMISE实例
                promiseAry[i].then(val => {
                    index++;
                    result[i] = val;//=>索引需要和promiseAry对应上,保证结果的顺序和数组顺序一致
                    if (index === promiseAry.length) {
                        resolve(result);
                    }
                }, reject);
            }
        });
    }
}

module.exports = Promise;

原文地址:https://www.cnblogs.com/jiajialove/p/11990738.html

时间: 2024-10-11 18:20:49

手写Promise A+ 规范的相关文章

手写 Promise

在上一章节中我们了解了 Promise 的一些易错点,在这一章节中,我们会通过手写一个符合 Promise/A+ 规范的 Promise 来深入理解它,并且手写 Promise 也是一道大厂常考题,在进入正题之前,推荐各位阅读一下 Promise/A+ 规范,这样才能更好地理解这个章节的代码. 实现一个简易版 Promise 在完成符合 Promise/A+ 规范的代码之前,我们可以先来实现一个简易版 Promise,因为在面试中,如果你能实现出一个简易版的 Promise 基本可以过关了. 那

js手写&#39;Promise&#39;

/* * pending:初始化成功 * fulfilled:成功 * rejected:失败 * */ function Promise(executor) {// 执行器 this.status = 'pending'; this.value = undefined; this.reason = undefined; this.fulfilledCallback = []; this.rejectCallback = []; let resolve = (value)=>{ if(this.

手写promise

写在前面: 在目前的前端分开中,我们对于异步方法的使用越来越频繁,那么如果处理异步方法的返回结果,如果优雅的进行异步处理对于一个合格的前端开发者而言就显得尤为重要,其中在面试中被问道最多的就是对Promise方法的掌握情况,本章将和大家一起分析和完成一个Promise方法,希望对你的学习有一定的帮助. 了解Promise 既然我们是要模仿ES6的Promise,那我们必然要知道这个方法主要都是用来干什么的,有哪些参数,有什么特性,为什么要使用Promise及如何使用等等. 为什么要使用它? 1.

手写promise进阶版本

promise/A+规范: 术语: 1.promise是一个对象或者函数,该对象或者函数有一个then方法 2.thenable是一个函数或者对象,用来定义then方法 3.value是promise成功时的状态值 4.reason是promise失败时的状态值 要求:一.二 一. 1.三种状态 :pending | fulfilled(resolved) | rejected 2.rejected当处于pending状态的时候,可以转移到fulfilled(resolved)或者rejecte

深入理解Promise并写一个符合Promise a+规范的Promise代码

关于Promise函数可以参考我写的这篇文章https://www.cnblogs.com/qiaohong/p/7705262.html,我们现在就深入理解一下这个函数. 首先说下Promise方法,Promise方法中还是有些是比较好用的,比如说Promise.all()方法(Promise.all()方法的参数是一个数组,会按照数组的结果放到成功的回调里,如果有一个错误那么就不会成功).Promise.race()方法(这个方法的参数也是一个数组,Promise.race()会同时发起并发

【前端面试】同学,你会手写代码吗?

CSS 部分 两栏布局 要求:垂直两栏,左边固定右边自适应. 查看代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-e

手写一个promise

Promise A+ 规范:https://promisesaplus.com/ 代码实现 class myPromise { constructor(executor) { this.state = 'pending'; this.value = undefined; this.reason = undefined; this.onResolvedArray = []; this.onRejectedArray = []; const resolve = (val) => { if (this

22 道高频 JavaScript 手写面试题及答案

实现防抖函数(debounce) 防抖函数原理:在事件被触发n秒后再执行回调,如果在这n秒内又被触发,则重新计时. 那么与节流函数的区别直接看这个动画实现即可. 手写简化版: // 防抖函数 const debounce = (fn, delay) => { let timer = null; return (...args) => { clearTimeout(timer); timer = setTimeout(() => { fn.apply(this, args); }, del

用BP人工神经网络识别手写数字

http://wenku.baidu.com/link?url=HQ-5tZCXBQ3uwPZQECHkMCtursKIpglboBHq416N-q2WZupkNNH3Gv4vtEHyPULezDb50ZcKor41PEikwv5TfTqwrsQ4-9wmH06L7bYD04u 用BP人工神经网络识别手写数字 yzw20091201上传于2013-01-31|暂无评价|356人阅读|13次下载|暂无简介|举报文档 在手机打开 赖勇浩( http://laiyonghao.com ) 这是我读工