完整版本实现promise (二)

        //E6 中采用了 Promise/A+ 规范
        //完整版本实现 Promise
        class MyPromise {
            // 放入callbacks队列，其实也就是注册回调函数，可以向观察者模式方向思考；
            callbacks = [];
            state = "pending" //增加状态
            value = null; //保存结果
            // Promise对象接受一个回调函数作为参数,
            //该回调函数接受两个参数，分别是成功时的回调resolve和失败时的回调reject
            constructor(fn) {
                //第一个参数 成功时的回调resolve
                fn(this._resolve.bind(this))
            }
            //接受两个参数
            then(onfulfilled) {
                // then 返回的一定是一个新的Promise实例
                return new MyPromise(resolve=>{
                    this._handle({
                        //通过then传递的回调函数
                        onfulfilled: onfulfilled ||null,
                        //创建promise 成果的resolve状态的信息
                        resolve:resolve
                    })                    
                });

                //在resolve 之前，跟之前的逻辑一样,添加到callbacks中
                // if (this.state === "pending") {
                //     this.callbacks.push(onfulfilled);
                // } else {
                //     //在resolve之后，直接执行回调，返回结果
                //     onfulfilled(this.value)
                // }
                //而不是返回当前实例的this对象
                // return this; 实现链式调用操作
                // 真正的链式 Promise 是指在当前 Promise 达到 fulfilled 状态后面的状态一样
            }
            _handle(callback){
                if(this.state==="pending"){
                    this.callbacks.push(callback);
                    return;
                }
                //如果then中没有传递任何东西
                if(!callback.onfulfilled){
                    // 值继续保留到下个then方法中
                    callback.resolve(this.value)
                    return;
                }
                //执行then方法中的回调
                let ret=callback.onfulfilled(this.value);
                //放回值作为下个then 的参数值
                callback.resolve(ret);
            }
            //resolve 接受一个参数支持任意类型
            _resolve(value) {
                // 通过 setTimeout 机制，将 resolve 中执行回调的逻辑放置到JS任务队列末尾，以保证在 resolve 执行时
                // ，then方法的 onFulfilled 已经注册完成
                this.state = "fulfilled" //改变成成功状态
                this.value = value; //保存结果
                // setTimeout(() => {  //通过改变状态直接返回结果
                // this.callbacks.forEach(fn => fn(value));
                // })
                this.callbacks.forEach(callback=>this._handle(callback))
            }
        }
        let p = new MyPromise(resolve => {
            // setTimeout(() => {  //增加延迟调用实现同步 去除settimeout去掉"同步执行“没有打印结果，我们可以在mypromise加延迟操作，
            resolve("5秒")
            // }, 5000);
            return '123'
        })

        let p1 = p.then(e => {
            console.log("1", e);
            return '123'
        })
        .then(e => {
            console.log("2", e);
        })
        // .then(e => {
        //     console.log("3", e);
        // })

        // setTimeout(() => {
        //     p1.then(e => {
        //         console.log("disange" + e);
        //     })
        // });

 

 class MyPromise {
            callBacks = [];
            state = 'pending';
            constructor(fn) {
                fn(this._resolve.bind(this), this._reject.bind(this));
            }
            then(onFulfilled, onRejected) {
                return new MyPromise((resolve, reject) => {
                    this._handle({
                        onFulfilled: onFulfilled || null,
                        onRejected: onRejected || null,
                        resolve: resolve,
                        reject: reject
                    })
                })
            }
            catch(onError) {
                return this.then(null, onError);
            }
            finally(onDone) {
                if (typeof onDone !== 'function') return this.then();
                let mypromise = this.constructor;

                return this.then(value => onDone()).then(() => value), reason => Promise.resolve(onDone()).then(() => { throw reason })
            }
            _handle(callback) {
                if (this.state == 'pending') {
                    this.callBacks.push(callback)
                    return;
                }
                let cb = this.state === 'fulfilled' ? callback.onFulfilled : callback.onRejected
                //如果then中没有传递任何东西
                if (!cb) {
                    cb = this.state === 'fulfilled' ? callback.reject : callback.resolve;
                    cb(this.value)
                    return;
                }
                let ret = cb(this.value);
                cb = this.state === 'fulfilled' ? callback.reject : callback.resolve;
                cb(ret);

            }
            _resolve(value) {
                if (value && (typeof value === 'object' || typeof value === 'function')) {
                    let then = value.then;
                    if (typeof then === 'function') {
                        then.call(value, this._resolve.bind(this));
                        return;
                    }
                }
                this.state = 'fulfilled';  //改变状态
                this.value = value;  //保存值
                this.callBacks.forEach(callBack => this._handle(callback));
            }
            _reject(error) {
                this.state = 'rejected'
                this.value = error;
                this.callBacks.forEach(callback => this._handle(callback));
            }
        }

        let mypro = new MyPromise((resolve, rej) => {
            rej('aaaa')
        })
        let aaa = mypro.then((res) => {
            console.log('seccun:', res)
        }, err => {
            console.log('error:', err)
        })