1.概念
所谓Promise
,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。
Promise
对象有以下两个特点。
(1)对象的状态不受外界影响。Promise
对象代表一个异步操作,有三种状态:pending
(进行中)、fulfilled
(已成功)和rejected
(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise
这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。
(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise
对象的状态改变,只有两种可能:从pending
变为fulfilled
和从pending
变为rejected
。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise
对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
2.基本用法
创造一个Promise实例
const promise = new Promise(function(resolve, reject) {if (/* 异步操作成功 */){resolve(value);} else {reject(error);}});
Promise
实例生成以后,可以用then
方法分别指定resolved
状态和rejected
状态的回调函数,then
方法是定义在原型对象Promise.prototype
上的。它的作用是为 Promise 实例添加状态改变时的回调函数。
promise.then(function(value) {console.log(value)}, function(error) {console.log(error)});
Promise.prototype.catch
方法是.then(null, rejection)
或.then(undefined, rejection)
的别名,用于指定发生错误时的回调函数。
如果该对象状态变为resolved
,则会调用then
方法指定的回调函数;如果异步操作抛出错误,状态就会变为rejected
,就会调用catch
方法指定的回调函数,处理这个错误。另外,then
方法指定的回调函数,如果运行中抛出错误,也会被catch
方法捕获。
promise.then(function(posts) {}).catch(function(error) {// 处理回调函数运行时发生的错误console.log('发生错误!', error);});
下面进行一个Promise实际操作
const api = {handlePromise () {let promise = new Promise(resolve => { // 生成一个Promise对象let AWSC = window.AWSC // AWSC为一个封装的方法var uabModule, webUmidTokenAWSC.use('uab', function (state, uab) {if (state === 'loaded') {uabModule = uab.getUA()if (uabModule && webUmidToken) {let data = {uabModule,webUmidToken}resolve(data) // 成功赋值}}})})return promise}}export default api// 调用api.handlePromise().then(res => console.log(res)).catch(err=>console.log(err))// 采用async调用Promise对象async handleApi () {let res = await api.handlePromise()console.log(res)},
Promise 在resolve
语句后面,再抛出错误,不会被捕获,等于没有抛出。因为 Promise 的状态一旦改变,就永久保持该状态,不会再变了。
跟传统的try/catch
代码块不同的是,如果没有使用catch
方法指定错误处理的回调函数,Promise 对象抛出的错误不会传递到外层代码,即不会有任何反应。
const promise = new Promise(function(resolve, reject) {// 下面一行会报错,因为x没有声明resolve(x + 2);});promise.then(function() {console.log('everything is great');});// 报红错 Uncaught (in promise) ReferenceError: x is not definedpromise.catch(function(err) {console.log('everything is great');});// 捕获了错误 打印出了错误 没有报错 ReferenceError: x is not defined
产生的 Promise 对象中,内部有语法错误。浏览器运行到这一行,会打印出错误提示ReferenceError: x is not defined
,但是不会退出进程、终止脚本执行。这就是说,Promise 内部的错误不会影响到 Promise 外部的代码,通俗的说法就是“Promise 会吃掉错误”。
Promise.prototype.finally()
finally
方法用于指定不管 Promise 对象最后状态如何,都会执行的操作。该方法是 ES2018 引入标准的。
promise.then(result => {···}).catch(error => {···}).finally(() => {···});
上面代码中,不管promise
最后的状态,在执行完then
或catch
指定的回调函数以后,都会执行finally
方法指定的回调函数。
Promise.all()
Promise.all
方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。
const p = Promise.all([p1, p2, p3]).then(([v1,v2,v3]) => console.log(v1,v2))
Promise.all
方法接受一个数组作为参数,p1
、p2
、p3
都是 Promise 实例(Promise.all
方法的参数可以不是数组,但必须具有 Iterator 接口,且返回的每个成员都是 Promise 实例。)
p
的状态由p1
、p2
、p3
决定,分成两种情况。
(1)只有p1
、p2
、p3
的状态都变成fulfilled
,p
的状态才会变成fulfilled
,此时p1
、p2
、p3
的返回值组成一个数组,传递给p
的回调函数。
(2)只要p1
、p2
、p3
之中有一个被rejected
,p
的状态就变成rejected
,此时第一个被reject
的实例的返回值,会传递给p
的回调函数。
Promise.resolve()
有时需要将现有对象转为 Promise 对象,Promise.resolve
方法就起到这个作用。
Promise.resolve('foo')// 等价于new Promise(resolve => resolve('foo'))
(1)参数是一个 Promise 实例
如果参数是 Promise 实例,那么Promise.resolve
将不做任何修改、原封不动地返回这个实例。
(2)参数是一个thenable
对象
thenable
对象指的是具有then
方法的对象,比如下面这个对象。
let thenable = {then: function(resolve, reject) {resolve(42);}};
Promise.resolve
方法会将这个对象转为 Promise 对象,然后就立即执行thenable
对象的then
方法。
let thenable = {then: function(resolve, reject) {resolve(42);}};let p1 = Promise.resolve(thenable);p1.then(function(value) {console.log(value); // 42});
上面代码中,thenable
对象的then
方法执行后,对象p1
的状态就变为resolved
,从而立即执行最后那个then
方法指定的回调函数,输出 42。
(3)参数不是具有then
方法的对象,或根本就不是对象
如果参数是一个原始值,或者是一个不具有then
方法的对象,则Promise.resolve
方法返回一个新的 Promise 对象,状态为resolved
。
const p = Promise.resolve('Hello');p.then(function (s){console.log(s)});// Hello
上面代码生成一个新的 Promise 对象的实例p
。由于字符串Hello
不属于异步操作(判断方法是字符串对象不具有 then 方法),返回 Promise 实例的状态从一生成就是resolved
,所以回调函数会立即执行。Promise.resolve
方法的参数,会同时传给回调函数。
(4)不带有任何参数
Promise.resolve
方法允许调用时不带参数,直接返回一个resolved
状态的 Promise 对象。
所以,如果希望得到一个 Promise 对象,比较方便的方法就是直接调用Promise.resolve
方法。
const p = Promise.resolve();p.then(function () {// ...});
上面代码的变量p
就是一个 Promise 对象。
需要注意的是,立即resolve
的 Promise 对象,是在本轮“事件循环”(event loop)的结束时,而不是在下一轮“事件循环”的开始时。
setTimeout(function () {console.log('three');}, 0);
Promise.resolve().then(function () {console.log('two');});
console.log('one');// one// two// three
上面代码中,setTimeout(fn, 0)
在下一轮“事件循环”开始时执行,Promise.resolve()
在本轮“事件循环”结束时执行,console.log('one')
则是立即执行,因此最先输出。
Promise.reject()
Promise.reject(reason)
方法也会返回一个新的 Promise 实例,该实例的状态为rejected
。
评论 (0)