ES6- 详解Promise,Promise的一些API的实现

概述

Promise 是一个对象它代表了一个异步操作的最终完成或者失败。

ECMAscript 6 原生提供了 Promise 对象,由于它的then和catch、finally方法会返回一个新的Promise所以可以允许我们链式调用,解决了传统的回调地狱问题。

特点

Promise对象的两个特点:

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

Promise对象有三种状态: pending(进行中) fulfilled (已成功) rejected(已失败)。

2、一旦状态改变,就不会再变,任何时候都可以得到这个结果。

Promise对象的状态改变,只有两种可能: 从pending变为fulfilled或resolve 表示成功 从pending变为rejected 表示失败
成功的结果数据一般称为 value,失败的结果数据一般称为reason

基本结构

var promise = new Promise(function(resolve, reject) {

    // 异步处理    

    // 处理结束后、调用resolve 或 reject

});

Promise 构造函数包含一个参数和一个带有 resolve(解析)和 reject(拒绝)两个参数的回调。在回调中执行一些操作(例如异步),如果一切都正常,则调用 resolve,否则调用 reject。

Promise常用方法

原型方法:then 方法 、catch 方法、 finally 方法

方法:resolve方法、reject 方法 、all方法、 race方法、any方法、allSettled方法

then 方法接受两个参数:

promise.then(onFulfilled, onRejected)

catch 方法

相当于调用 then 方法, 但只传入 Rejected 状态的回调函数

catch (onRejected) {

  return this.then(undefined, onRejected)

}

finally 方法

finally 方法用于指定不管 Promise 对象最后状态如何,都会执行的操作

finally (cb) {

  return this.then(

    value  => MyPromise.resolve(cb()).then(() => value),

    reason => MyPromise.resolve(cb()).then(() => { throw reason })

  );

};

then 方法 、catch 方法

Promise的状态一经改变就不能再改变。

.then和.catch都会返回一个新的Promise。catch不管被连接到哪里,都能捕获上层未捕捉过的错误。

在Promise中,返回任意一个非 promise 的值都会被包裹成 promise 对象

Promise 的 .then 或者 .catch 可以被调用多次, 但如果Promise内部的状态一经改变,并且有了一个值,那么后续每次调用.then或者.catch的时候都会直接拿到该值。

.then 或者 .catch 中 return 一个 error 对象并不会抛出错误,所以不会被后续的 .catch 捕获。

.then 或 .catch 返回的值不能是 promise 本身,否则会造成死循环。

.then 或者 .catch 的参数期望是函数,传入非函数则会发生值透传。

.then方法是能接收两个参数的,第一个是处理成功的函数,第二个是处理失败的函数,你可以认为catch是then第二个参数的简便写法。

.finally方法也是返回一个Promise,他在Promise结束的时候,无论结果为resolved还是rejected,都会执行里面的回调函数。

finally方法

.finally()方法不管Promise对象最后的状态如何都会执行

.finally()方法的回调函数不接受任何的参数,也就是说你在.finally()函数中是没法知道Promise最终的状态是resolved还是rejected的

它最终返回的默认会是一个上一次的Promise对象值,不过如果抛出的是一个异常则返回异常的Promise对象。

all方法、race方法:

Promise.all()的作用是接收一组异步任务,然后并行执行异步任务,并且在所有异步操作执行完后才执行回调。

.race()的作用也是接收一组异步任务,然后并行执行异步任务,只保留取第一个执行完成的异步操作的结果,其他的方法仍在执行,不过执行结果会被抛弃。

Promise.all().then()结果中数组的顺序和Promise.all()接收到的数组顺序一致。

all和race传入的数组中如果有会抛出异常的异步任务,那么只有最先抛出的错误会被捕获,并且是被then的第二个参数或者后面的catch捕获;但并不会影响数组中其它的异步任务的执行。

Promise为什么能链式调用

由于它的then方法和catch、finally方法会返回一个新的Promise所以可以允许我们链式调用

Promise.all中如果有一个抛出异常了会如何处理

all会抛出异常的异步任务,最先抛出的错误会被捕获,并且是被then的第二个参数或者后面的catch捕获;但并不会影响数组中其它的异步任务的执行。

EventLoop的执行过程

一开始整个脚本作为一个宏任务执行

执行过程中同步代码直接执行,宏任务进入宏任务队列,微任务进入微任务队列当前宏任务

执行完出队,检查微任务列表,有则依次执行,直到全部执行完

执行浏览器UI线程的渲染工作

检查是否有Web Worker任务,有则执行

执行完本轮的宏任务,回到2,依此循环,直到宏任务和微任务队列都为空

上一篇:ES6新特性(上)——let及const、解构赋值、模板字符串、Symbol


下一篇:es6: 展开运算符