Promise对象--Mr.Ember

Promise对象--Mr.Ember

摘要

所谓promise，简单来讲就是一个容器，里面保存着某个将来才会结束的事件（一般是一个异步操做）

 

promise对象有一下特色：

1. 对象的状态不受外界影响

2. 一旦状态改变就不会再变，任什么时候候均可以获得这个结果。

有了promise对象，就能够将异步操做以同步操做的流程表达出来，避免了层层嵌套函数。

 

Promise.prototype.then()

1.then方法下一次的输入须要上一次的输出

2.若是一个promise执行完后，返回的仍是一个promise，会把这个promise的执行结果传递给下个then中

3.若是then中返回的不是Promise对象而是一个普通值，则会将这个结果做为下次then的成功结果

4.若是当前then中失败了 会走下一个then的失败

5.若是返回的是undefinded无论当前是成功仍是失败，都会走下一次成功

6.catch是错误没有处理的状况下才会走

7.then中不写方法则会穿透，传入下一个then中

 

Promise.prototype.catch()

Promise.prototype.catch方法是.then(null, rejection)的别名，用于指定发生错误时的回调函数。

p.then((val) => console.log('fulfilled:', val))
    .catch((err) => console.log('rejected', err))
//等同于
p.then((val) => console.log('fulfilled:', val))
    .then(null, (err) => console.log('rejected', err))

 

Promise.all()

Promise.all将多个Promise实例包装成一个新的Promise实例。

var  p = Promise.all([p1, p2, p3]);

 

p的状态由p1,p2,p3决定，分为两种状况：

1. 只有p1, p2, p3的状态都为Fulfilled，p的状态才会变成Fulfilled,此时p1,p2,p3的返回值成一个数组，传递给p的回调函数。

2. 只要p1,p2,p3有一个被rejected，p的状态就会变成Rejected，此时第一个被rejected的实例的返回值会传递给p的回调函数。

 

Promise.race()

Promise.race也是将多个Promise实例包装成一个新的Promise实例。

var  p = Promise.all([p1, p2, p3]);

 上述代码中，只要p1, p2, p3有一个实例率先改变状态，p的状态就跟着改变。那个率先改变Promise的实例的返回值就传递给p的回调函数。

 

Promise.resolve()

有时须要将现有的对象转为Promise对象，Promise.resolve方法就起到了这个做用。

var jsPromise = Promise.resolve($ajax('/whatever.json'));

 

上面的代码会将JQ代码生成的deferred对象转换为新的promise对象。

 

Promise.reject()

Promise.reject会返回一个新的Promise实例，状态为Rejected

var p = Promise.reject('出错了')
//等同于
var p = new Promise((resolve, reject) => reject('出错了')

p.then(null, function(s){
　　console.log(s)
})

 

Promise.done()

不管Promise对象的回调链以then的方法仍是catch的方法结尾，只要最后一个放大抛出错误，都有可能没法捕捉到（由于Promise内部错误不会冒泡到全局）。为此咱们能够提供一个done方法，它老是处于回调链的尾端，保证抛出任何可能出现的错误。

asyncFunc()
    .then(f1)
    .catch(r1)
    .then(f2)
    .done();

 

内部实现

Promise.prototype.done =  function (onFulfilled, onRejected) {
   this.then(onFulfilled, onRejected)
     .catch(function(reason) {
       //全局抛出一个错误
         setTimeout(() => {throw reson}, 0);
    })  
}

 

Promise.finally()

finally方法用于指定Promise对象最后状态如何都会执行的操做。他与done的区别在于，它接受一个普通的回调函数做为参数，该函数无论什么状态都会执行。

 

模拟实现promise

实现步骤：

1.promise 有个then函数，须要有个callback函数来保存回调函数

2.可能会又多个resolve调用处理，添加一个开关变量，仅使第一个resolve函数可使用

3.当出现多个then函数时，把callback属性改变成数组格式，保存每个then的回调函数

4.支持then链式调用，执行完then函数后返回this便可

5.支持异步的链式调用,判断当前函数是个对象而且还有.then函数，须要继续调用then,不然跟原来同样调用

 

 

function MyPromise(fn) {
    var _this = this;

    //用来保存then传入的回调函数
    this.callback = [];
    //处理 第一个resolve有效
    this.isResolved = false;

    function resolve(val) {
        if(_this.isResolved) return;
        _this.isResolved = true;

        if(_this.callback.length > 0) {
            _this.callback.forEach(item => {
                // func && func(val)
                var res, cb = item.cb, resolve=item.resolve;

                cb && (res = cb(val))
                if(typeof res === 'object' && res.then) {
                    res.then(resolve)
                }else {
                    resolve && resolve(res)
                }
                
            });
        }
    }

    fn(resolve);
}

MyPromise.prototype.then = function(cb) {
    var _this = this;
    return new MyPromise(function(resolve) {
        _this.callback.push({
            cb: cb,
            resolve: resolve
        })
    })
}

var  p = new MyPromise(function(resolve) {
    console.log(1)
    setTimeout(function() {
        resolve(2)
        resolve(4)
        resolve(5)
        resolve(6)
    }, 1000)
})

p.then(function(val) {
    console.log(val)
    return new MyPromise(function(resolve) {
        setTimeout(function() {
            resolve(val + 1)
        }, 1000)
    })
}).then(function(val) {
    console.log(val)
})

 打印结果

 

 先打印1，过了一秒打印2，再过一秒打印3