手写简易Promise

前言

首先，我是一名大四前端小白，如果以下内容有错误或值得改进的地方，还请各位大佬多多指点哈（疯狂吐槽）

Promise相信大家肯定相当熟悉，但对于像我刚入门的小白来说，想完全理解Promise的内部原理还是挺困难的。

Promise 对象拥有很强大的功能，它允许你为异步操作的成功和失败分别绑定相应的处理方法。 这让异步操作可以像同步操作一样返回值，但并不是立即返回最终执行结果，而是一个能代表未来出现的结果的promise对象，Promise有以下几种状态:

pending: 初始状态，状态变化前的就绪状态。
fulfilled: 意味着操作成功完成。
rejected: 意味着操作失败。
复制代码

pending状态的promise对象可能转变为fulfilled状态，也可能转变rejected状态。在这个状态转变的过程中，状态的变化是不可逆的。状态一旦改变，Promise对象的then方法绑定的处理方法就会被调用。

coding

了解以上的内容基本上就可以实现一个简易的promise对象，代码：

        //简易promise实现(resolve,reject)
        function promise(fn) {
            this.value = undefined // 成功状态值
            this.err = undefined // 失败状态值
            this.status = 'pending' // 开始状态（就绪）
            var t = this
            // 就绪 -> 成功
            function resolve(val) {
                if (t.status === 'pending') {
                    t.value = val
                    t.status = 'success'
                }
            }
            // 就绪 -> 失败
            function reject(err) {
                if (t.status === 'pending') {
                    t.err = err
                    t.status = 'fail'
                }
            }
            fn(resolve, reject)
        }
        promise.prototype.then = function(isSuccess, isFail) {
            var t = this
            // 实现promise的链式调用
            return new promise(function(resolve, reject) {
                // 用setTimeout模拟实现then方法的异步操作
                setTimeout(function() {
                    if (t.status === 'success') {
                        // 将then1回调函数返回的值传给then2回调函数，以此类推
                        resolve(isSuccess(t.value))
                    }
                    if (t.status === 'fail') {
                        reject(isFail(t.err))
                    }
                })
            })

        }
        
        // test 
        var p = new promise(function(resolve, reject) {
            if (1) {
                resolve("test resolve success")
            } else {
                reject("test rejecr fail")
            }

        })
        p.then(function(val) {
            console.log(val)
            return val + "链式调用return"
        }).then(function(val) {
            console.log(val)
        })
        
        // test resolve success
        // test resolve success链式调用return
复制代码

从上面的代码可以看出我只是简单实现了resolve、reject的功能，并没有考虑异常，和多个resolve回调的处理情况。在后续的学习中，会逐步实现一个完整的promise对象（好难，哈哈！）

结论

promise在异步编程中的使用是相当广泛的，刚入门的前端小白对于异步编程理解的不是很透彻，希望通过此例子对异步编程思想有一个更深刻的认识，如：even loop。