【ECMAScript 学习笔记】3.Promise 的使用

Promise 的作用

  Promise 用于异步计算,可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果。

  可以在对象之间传递和操作 Promise,帮助我们处理队列。

Promise 的声明

  new Promise(function(resolve,reject){
      resolve(); // 数据处理完成
      reject(); //数据处理出错
  }).then(function(res){
      // 成功数据 res
  },function(error){
      // 处理错误 error
  });
  • Promise 是一个代理对象,它和原先要进行的操作并无关系。
  • Promise 将回调函数改为链式调用解决回调地狱问题。

Promise 的状态

  一个 Promise 可能有三种状态:

  • 等待(pending):初始化一个 Promise 对象时。
  • 已完成(fulfilled):操作成功时。
  • 已拒绝(rejected):操作失败时。

一个 Promise 状态只可能从“等待”转到“完成”或“拒绝”,不能逆向转换,同时“完成”和“拒绝”不能相互转换。

  当 Promise 状态发生改变,就会触发 then 函数。

  then函数接受两个参数,第一个参数是成功时的回调,在 Promise 由“等待“状态转换到”完成“状态时调用;第二个参数是失败时回调,在 Promise 由“等待”状态转换为“拒绝”状态时调用。

  then可以接受另加一个 Promise 传入,也接受一个 “类then” 的对象或方法,即 thenable 对象。

  同一个 Promise 的 then 可以调用多次,并且回调的执行顺序跟它们被定义的顺序一致。

Promise 常用的函数

Promise.then()

  • Promise.then() 接受两个函数作为参数,分别代表 fulfilled 状态下的响应函数 和 rejected 状态下的响应函数。
  • Promise.then() 返回一个新的 Promise 实例,所以支持链式调用。
  • Promise 状态发生改变时,Promise.then() 会根据其返回的最终状态,调用相应的响应函数。
  • Promise.then() 中可以返回一个新的 Promise 或其他值。
  • 如果返回值为新的 Promise 时,那么下一级 Promise.then() 会在新的 Promise 状态改变后执行。
  • 如果返回值为其他值,那么下一级 Promise.then() 会立即执行。

在嵌套 Promise.then()时 ,由于 Promise.then() 返回的还是一个 Promise,所以下一级的 Promise.then() 会等到里面的 Promise.then() 执行完后再执行。

Promise.catch()

  Promise.catch()Promise.then(resolve,reject)reject 的别名,用于指定发生错误的回调函数。用法如下:

    new Promise((resolve,reject)=>{

    }).then(res=>{

    }).catch(error=>{

    });

Promise.catch() 也会返回一个 Promise,并且其状态也为 pending

reject 的作用等同于抛出一个异常。如果 Promise 状态已经变成 resolved ,再抛出错误是无效的

Promise.finally()

  Promise.finally() 是用于指定无论 Promise 最终状态如何,都会执行的操作,是在 ES2018 中引入的。用法如下:

    new Promise((resolve,reject)=>{

    }).then(res=>{

    }).catch(error=>{

    }).finally(()=>{

    });

Promise.finally()方法的回调函数不接受任何参数,因此Promise.finally()方法里面的操作,与Promise的状态无关。

Promise.finally() 本质上是 Promise.then() 的特例,Promise.finally() 方法总是会返回原来的值。

Promise.all()

  Promise.all 方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。使用方法如下:

    new Promise.all([p1,p2,p3]);

Promise.all 的参数可以不是数组,但参数必须具有 Iterator 接口,且返回的每个成员都是 Promise 实例。

  Promise.all 的状态由传入的参数决定,分为两种情况:

  • 当数组中所有 Promise 状态完成,该 Promise 才算完成,其返回结果为全部值的数组。
  • 当其中任何一个失败,该 Promise 则失败,此时第一个被 reject 的实例的返回值。

Promise.race()

  Promise.race 方法同样是将多个 Promise 实例,包装成一个新的 Promise 实例。使用方法如下:

    new Promise.race([p1,p2,p3]);

只要参数中的任何一个状态更改,其返回结果则为率先改变的 Promise 实例。

Promise.resolve()

  Promise.resolve 方法可以将现有对象转为 Promise 对象,如下:

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

  Promise.resolve 方法的参数分为四种结果:

  • 参数是一个 Promise 实例
      Promise.resolve将不做任何修改,原封不懂的返回。

  • 参数是一个 thenable 对象

  thenable 对象指的是具有 then 方法的对象,如下:

    const thenable = {
        then: function(resolve,reject){
            resolve();
        }
    };

Promise.resolve 会将这个方法转为 Promise 对象然后立即执行 thenable 对象中的 then 方法。

  • 参数不是具有 then 方法的对象,或根本就不是对象
      Promise.resolve 会返回一个新的 Promise 对象的实例,其状态为 fulfilled

  • 不带有任何参数
      Promise.resolve 方法允许调用时不带参数,它回直接返回一个状态为 fulfilledPromise 实例。

Promise.reject()

   Promise.reject 也会返回一个 Promise 实例,状态为 rejected

     const jsPromise = Promise.reject('Error');

Promise.try()

   Promise.try就是模拟 try 代码块。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值