手写实现promise

_ang 发布于2019-08-30 15:44 / 504人阅读

摘要：简易版本的第一步列出三大块第二步负责注册所有的函数负责执行所有的函数第三步在里面要加上防止还没进行注册就直接执行了第四步里面要返回这样就可以链式调用了第五步三个状态的管理的链式调用在里面一个这样才能里面加上异步函数加上了加入状态为了解决在异

// 简易版本的promise

    // 第一步： 列出三大块  this.then   resolve/reject   fn(resolve,reject)
    // 第二步： this.then负责注册所有的函数   resolve/reject负责执行所有的函数 
    // 第三步： 在resolve/reject里面要加上setTimeout  防止还没进行then注册 就直接执行resolve了
    // 第四步： resolve/reject里面要返回this  这样就可以链式调用了
    // 第五步： 三个状态的管理 pending fulfilled rejected
 
    // *****promise的链式调用 在then里面return一个promise 这样才能then里面加上异步函数
    // 加上了catch
    function PromiseM(fn) {
        var value = null;
        var callbacks = [];
        //加入状态 为了解决在Promise异步操作成功之后调用的then注册的回调不会执行的问题
        var state = "pending";
        var _this = this;

        //注册所有的回调函数
        this.then = function (fulfilled, rejected) {
            //如果想链式promise 那就要在这边return一个new Promise
            return new PromiseM(function (resolv, rejec) {
                //异常处理
                try {
                    if (state == "pending") {
                        callbacks.push(fulfilled);
                        //实现链式调用
                        return;
                    }
                    if (state == "fulfilled") {
                        var data = fulfilled(value);
                        //为了能让两个promise连接起来
                        resolv(data);
                        return;
                    }
                    if (state == "rejected") {
                        var data = rejected(value);
                        //为了能让两个promise连接起来
                        resolv(data);
                        return;
                    }
                } catch (e) {
                    _this.catch(e);
                }
            });
        }

        //执行所有的回调函数
        function resolve(valueNew) {
            value = valueNew;
            state = "fulfilled";
            execute();
        }

        //执行所有的回调函数
        function reject(valueNew) {
            value = valueNew;
            state = "rejected";
            execute();
        }

        function execute() {
            //加入延时机制 防止promise里面有同步函数 导致resolve先执行 then还没注册上函数
            setTimeout(function () {
                callbacks.forEach(function (cb) {
                    value = cb(value);
                });
            }, 0);
        }

        this.catch = function (e) {
            console.log(JSON.stringify(e));
        }

        //经典 实现异步回调
        fn(resolve, reject);
    }

专线服务混合云 jquery_promise实现 Promises promise promises异步

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/116252.html

手写一款符合Promise/A+规范的Promise

摘要：手写一款符合规范的长篇预警有点长，可以选择性观看。初始状态是，状态可以有或者不能从转换为或者从转换成即只要由状态转换为其他状态后，状态就不可变更。手写一款符合Promise/A+规范的Promise 长篇预警！有点长，可以选择性观看。如果对Promise源码不是很清楚，还是推荐从头看，相信你认真从头看到尾，并且去实际操作了，肯定会有收获的。主要是代码部分有点多，不过好多都是重复的，不...

rubyshen 2019-08-23 15:20 评论0 收藏0
【js】what is Promise和手写实现简易版Promise

摘要：有三种状态，等待中，已完成，已失败。对象状态不受外界影响，只有异步操作的结果可以改变状态，这就是的由来怎么用接受一个函数作为参数，这个参数函数的两个参数分别是和，用来执行了两种状态的回调函数。当实例生成后，用方法来指定两种状态的回调函数。什么是Promise 官方的解释：Promise是一个用来传递异步操作消息的对象。Promise有三种状态，pending（等待中），resolve...

LMou 2019-08-23 18:25 评论0 收藏0
手写实现promise

摘要：简易版本的第一步列出三大块第二步负责注册所有的函数负责执行所有的函数第三步在里面要加上防止还没进行注册就直接执行了第四步里面要返回这样就可以链式调用了第五步三个状态的管理的链式调用在里面一个这样才能里面加上异步函数加上了加入状态为了解决在异 // 简易版本的promise // 第一步：列出三大块 this.then resolve/reject fn(resolv...

skinner 2019-08-26 10:45 评论0 收藏0
promise/A+规范翻译以及手写实现

摘要：如果实现满足所有要求，则实现可能允许。本条款允许使用特定于实现的方法来采用已知一致承诺的状态。接下来根据规范进行手写实现注释偷懒就将对应的规范标注出来，其实基本上就是对着规范实现。如果要手写实现promise，那么先看看promise/A+规范，再来实现，将会事半功倍。那么我先翻译一下Promise/A+规范中的内容。术语 1.1 promise 是一个带有符合此规范的the...

LiuZh 2019-08-23 16:09 评论0 收藏0
「中高级前端面试」JavaScript手写代码无敌秘籍

摘要：第一种直接调用避免在不必要的情况下使用，是一个危险的函数，他执行的代码拥有着执行者的权利。来自于此外，实现需要考虑实例化后对原型链的影响。函数柯里化的主要作用和特点就是参数复用提前返回和延迟执行。手写路径导航实现一个new操作符实现一个JSON.stringify 实现一个JSON.parse 实现一个call或 apply 实现一个Function.bind 实现一个继承实现一个J...

Zhuxy 2019-05-23 16:26 评论0 收藏0