手写promise

// 手写promise
 (function(window){
     /**
      * 构造函数
      * executor：执行器函数
      */
    function Promise(executor){
        var self = this
        self.status = 'pending' // 状态，初始为pending
        self.data = undefined // 储存结果
        self.callbacks = [] // 每个元素：{ onResolved(){},onRejected(){} }

        function resolve(value){
            if(self.status === 'pending'){
                // 状态改变
                self.status = 'resolved'
                // 保存value值
                self.data = value     
                // 是否有未执行的回调函数，有则开始异步执行
                if(self.callbacks.length>0){
                    setTimeout(()=>{
                        self.callbacks.forEach(callbackObj => {
                            callbackObj.onResloved(value)
                        });
                    })
                }
            }
        }
        function reject(value){
            if(self.status === 'pending'){
                // 状态改变
                self.status = 'rejected'
                // 保存value值
                self.data = value        
                // 是否有未执行的回调函数
                if(self.callbacks.length>0){
                    self.callbacks.forEach(callbackObj => {
                        callbackObj.onRejected(value)
                    })
                }
            }
        }
        try {
            executor(resolve,reject)
        } catch (error) {
            reject(error)
        }

    }
    /**
     * 返回新的promise
     */
    Promise.prototype.then = function(onResloved,onRejected){
        var self = this
        // 传入的回调函数若不是函数，跳过即可
        onResloved = typeof onResloved === 'function' ? onResloved : function(){}
        onRejected = typeof onRejected === 'function' ? onRejected : function(){}
        
        // 返回新的promise
        return new Promise((resolve,reject)=>{
            // 封装处理回调函数的方法
            function handleCallBack(callback){
                try {
                    const result = callback(self.data)
                    if(result instanceof Promise){// 回调函数返回的是promise，则返回该promise的结果
                        result.then(
                            value => resolve(value),
                            reason => reject(reason)
                        )
                    }else{
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }
            }
            if(self.status === 'pending'){
                // 状态为pending，保存回调函数到callbacks
                self.callbacks.push({
                    onResloved(){
                        handleCallBack(onResloved)
                    },
                    onRejected(){
                        handleCallBack(onRejected)
                    }
                })
            }
            if(self.status === 'resolved'){
                // 异步处理
                setTimeout(()=>{
                    handleCallBack(onResloved)
                })
            }
            if(self.status === 'rejected'){
                // setTimeout(()=>{
                //     handleCallBack(onRejected)
                // }
            }
        })
    }
    /**
     * catch - 和then的第二个回调函数相同
     */
    Promise.prototype.catch = function(onRejected){
        return this.then(undefined,onRejected)
    }
    Promise.resolve = function(value){
        var self = this
        return new Promise((resolve,reject)=>{
            if(value instanceof Promise){
                self.then(
                    result => resolve(result),
                    reason => reject(reason)
                )
            }else{
                resolve(value)
            }
        })
    }
    Promise.reject = function(reason){
        return new Promise((resolve,reject)=>{
            reject(reason)
        })
    }
    Promise.all = function(promises){
        // 返回新的promise
        return new Promise((resolve,reject)=>{
            var array = new Array(promises.length) // 储存每个promise的data
            var count = 0 // 记录resolved的promise个数
            // promise数组中不一定每个元素都是promise
            promises.forEach((p,index)=>{
                Promise.resolve(p).then(result => {
                    array[index] = result
                    count++
                    if(count == promises.length){
                        resolve(array)
                    }
                },reason => { // 只要有一个promise状态转变为rejected，Promise状态即转变为rejected
                    reject(reason)
                })
            })
        })
    }
    Promise.race = function(promises){
        // 只要有一个promise状态改变，即随之改变
        return new Promise((resolve,reject)=>{
            promises.forEach((p)=>{
                Promise.resolve(p).then(
                    result => resolve(result),
                    reason => reject(reason)
                )
            })
        })
    }

    window.Promise = Promise
})()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Promise</title>
</head>
<body>
    <script>
        function resolve(self, value){
            self.value = value
            if(value instanceof self.constructor){
                self.state = 3
            }else {
                self.state = 1
            }
            finale(self)
        }
        function reject(self, reason){
            self.value = reason
            self.state = 2
            finale(self)
        }
        function finale(self){
            if(self.callbacks.length > 0){
                self.callbacks.forEach(item => {
                    handle(self, item)
                });
                self.callbacks = []
            }
        }
        function handle(self, deferred){
            while(self.state === 3){
                self = self.value
            }
            if(self.state === 0){
                self.callbacks.push(deferred)
                return
            }
            var f;
            var res;
            if(self.state === 1){
                f = deferred.onResolved
            }else if(self.state === 2){
                f = deferred.onRejected
            }
            try {
                if(!f){
                    res = self.value
                }else{
                    res = f(self.value)
                }
            } catch (error) {
                reject(self, error)
            }
            resolve(deferred.promise, res)
        }

        class Promise{
            constructor(fn){
                this.value = undefined
                this.state = 0
                this.callbacks = [] //{onResolved, onRejected}
                try {
                    fn(value => {
                        if(this.state === 0){
                            resolve(this, value)  
                        }
                    }, reason => {
                        if(this.state === 0){
                            reject(this, reason)
                        }
                    })
                } catch (error) {
                    reject(this, error)
                }
            }

            then(onResolved, onRejected){
                var prom = new this.constructor()
                var o = {}
                o.onResolved = typeof onResolved === 'function' ? onResolved : null
                o.onRejected = typeof onRejected === 'function' ? onRejected : null
                o.promise = prom
                handle(this,o)
                return prom
            }
        }

        new Promise((resolve, reject) => {
            // setTimeout(() => {
                resolve(12121212)
            // });
        })
        // .then(value => {
        //     return new Promise((resolve, reject) => {
        //         resolve(111111)
        //     }).then(value => {
        //         return new Promise((resolve, reject) => {
        //             resolve(999)
        //         })
        //     })
        // })
        .then()
        .then(value => {
            console.log(value)
        })
    </script>
</body>
</html>