Promise对象(es6)

176 阅读3分钟

ES6总结系列之 Promise对象 篇


1. 含义

何为 Promise?

Promise 是异步编程的一种解决方案 Promise 简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果

Promise 两个特点:

①对象的状态不受外界影响,只有异步操作的结果,可以决定当前是那种状态pending(进行中), fulfilled(已成功), rejected(已失败) ②状态只改变一次,状态转变只有两种可能,改变后称resolved(定型) 1)pending --> fulfilled 2)pending --> rejected

Promise 三个缺点:

①无法取消Promise, 一旦新建它就会立即执行,无法中途取消 ②如果不设置回调函数,Promise内部抛出的错误,不会反应到外部 ③当处于pending状态时,无法得知目前进展哪一个阶段(刚刚开始还是即将完成)

2. 基本用法

Promise 对象是一个构造函数,用来生成 Promise 实例

const promise = new Promise(function(resolve, reject) {
  // ... some code
  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }});
  1. 创建实例 ①resolve, reject 两个函数,有JavaScript引擎提供 ②resolve作用,将Promise状态从“未完成”变为“成功”,即从pending转为resolved ③reject 作用,从pending转为rejected ④resolve,reject 都可向外传出参数

  2. 实例生成后,可以用then方法分别指定resolved状态和rejected状态的回调函数,第二个参数可不传

promise.then(function(value) {//value为resolve(value)中传出的
  // success}, 
function(error) {//error为reject(error)中传出的
  // failure});

3. Promise.prototype.then()

then 方法返回的是一个新的Promise实例,可链式调用,并将return的返回值为参数传入第二个回调函数

getJSON("/posts.json").then(function(json) {
  return json.post;
}).then(function(post) {
  // ...
});

4. Promise.prototype.catch()

catch方法是.then(null, rejection)或.then(undefined, rejection)的别名,用于指定发生错误时的回调函数。 一般来说,不要在then()方法里面定义 Reject 状态的回调函数(即then的第二个参数),总是使用catch方法。理由是第二种写法可以捕获前面then方法执行中的错误,也更接近同步的写法(try/catch)

// badpromise
  .then(function(data) {
    // success  
  }, function(err) {
    // error  
  });
  
// goodpromise
  .then(function(data) {
     //cb    // success  
  })	
  .catch(function(err) {
    // error  
  });

5. Promise.prototype.finally()

finally()方法用于指定不管 Promise 对象最后状态如何都会执行的操作。该方法是 ES2018 引入标准的。

promise
.then(result => {···})
.catch(error => {···})
.finally(() => {···});

6. Promise.all()

Promise.all() 用于批量处理 Promise,并包装成一个新的 Promise 实例

const p = Promise.all(p1, p2, p3)

p的状态由p1, p2, p3决定:

  1. 当p1, p2, p3结果都为'fulfilled',p才为'fulfilled'
  2. p1, p2, p3结果只要有一个为 'rejected' ,p就为 'rejected'

7. Promise.race()

同样是将多个 Promise 实例,包装成一个新的 Promise 实例

const p = Promise.race([p1, p2, p3]);

只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变(只更第一个改变状态的Promise有关,无视另外的变化)

多用于后台请求超时处理

8. Promise.allSettled()

只有等到所有这些参数实例都返回结果,不管是fulfilled还是rejected,包装实例才会结束

const p = Promise.allSettled([p1, p2, p3]);

多用于所有请求都结束后,关闭加载动画(不管请求成功或失败)

9. Promise.any()

Promise.any() 方法接受一组 Promise 实例作为参数,包装成一个新的 Promise 实例。 只要参数实例有一个变成fulfilled状态,包装实例就会变成fulfilled状态; 如果所有参数实例都变成rejected状态,包装实例就会变成rejected状态。


  • 个人Github,欢迎star^_^
  • ES6总结系列参考自阮一峰《ECMAScript6入门》