Promise简介以及常用方法

Posted minorf

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Promise简介以及常用方法相关的知识,希望对你有一定的参考价值。

一、Promise简介

  1、Promise是什么?

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

       2、Promise的状态

    pendding:初始状态,既不是成功,也不是失败状态

    fulfiled:操作成功

    rejected:操作失败

    pendding状态的Promise对象,可能会变为fulfiled状态并传递一个值给相应的状态处理方法,也可能变为rejected状态并传递失败信息。

  3、Promise的特点

    (1)、状态不会受到外界影响,只有异步操作的结果才能决定当前是哪一种状态,其他操作无法改变

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

  4、语法

  new Promise ( function( resolve, reject ){ ... })

  resolve:将Promise的状态置为fulfiled

  reject:将Promise的状态置为rejected

  5、Promise缺点

  (1)、一旦创建Promise就会立即执行,中途无法取消

  (2)、如果不设置回调函数,Promise内部抛出错误不会反应到外部

  (3)、处于pennding状态时,无法得知目前进展到哪一步

  6、Promise对象的then方法

  语法:.( onfulfiled , onrejected)=>{}

  then方法两个参数,都是函数类型,分别为onfulfiled以及onrejected,当Promise的状态为fulfiled时,调用then的onfulfiled方法,当Promise的状态为rejected时,调用then的onrejected方法

  onfulfiled函数:成功的回调函数 (value)=> { }

  onrejected函数:失败的回调函数    (reason ) => { }

  7、一个简单的Promise

 new Promise((resolve, reject) => {
    setTimeout(() => {
      // resolve(‘成功状态‘);
      reject(‘失败状态‘)
    }, 300);
  }).then((value) => {
    console.log(value);  //resolve才会输出  成功状态
  }, (reason) => {
    console.log(reason)  //reject才会输出   失败状态
  });

二、Promise几种常用方法

  1、Promise.resolve()

  返回一个给定值解析后的Promise对象。如果参数本身就是一个Promise对象,则直接返回这个Promise对象。

  栗子:

  //使用静态Promise.resolve方法 
  let promise = Promise.resolve(‘resolve方法‘);   promise.then((value) => {   console.log(value)  //输出: resolve方法   })
  //resolve另外一个promise   let promise1 = Promise.resolve(promise);   promise1.then((value) => { console.log(‘resolve另外一个promise:‘ + value)      //输出: resolve另外一个promise:resolve方法 })

  2、Promise.reject()

  返回一个带有拒绝原因的Promise对象。

  栗子: 

 let promise = Promise.reject(‘reject方法‘);
  promise.then((value) => { }, (rejected) => {
    console.log(rejected)  //输出:   reject方法
 })

  3、Promise.all()

  将多个Promise封装成一个新的Promise,成功时返回的是一个结果数组,失败时,返回的是最先rejected状态的值。

  使用场景:一次发送多个请求并根据请求顺序获取和使用数据

  栗子:

  let promise1 = Promise.resolve(1);
  let promise2 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(‘promise2‘);
    }, 2000);
  })
  let promise3 = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(‘promise3‘);
    }, 1000);
  })
  let promise4 = new Promise((resolve, reject) => {
    setTimeout(() => {
      reject(‘promise4‘);
    }, 1000);
  })
  let promise5 = Promise.reject(‘promise5‘);
Promise.all([promise1, promise2, promise3]).then((values) => {
  //三个promise都是成功的,所以会输出一个数组 console.log(values)    // [1, "promise2", "promise3"] })
Promise.all([promise1, promise2, promise3, promise4]).then((values) => { console.log(values)   }, (reason) => {
  //promise4是失败的,所以只会返回promise4的失败结果 console.log(reason)    //promise4 })
Promise.all([promise1, promise2, promise3, promise4, promise5]).then((values) => { console.log(values) }, (reason) => {
  //promise4个promise5都是失败的,但是promise5比promise4最先失败,所以返回promise5的失败结果 console.log(reason)    //promise5 })

  4、Promise.race()

  返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒绝。

  简单来说,就是多个Promise中,哪个状态先变为成功或者失败,就返回哪个Promise的值

 let promise1 = new Promise((resolve, reject) => {
  //setTimeout第三个以后的参数是作为第一个func()的参数传进去,promise1作为resolve的参数 setTimeout(resolve, 500, ‘promise1‘); }); let promise2 = new Promise((resolve, reject) => { setTimeout(resolve, 100, ‘promise2‘); }); let promise3 = new Promise((resolve, reject) => { setTimeout(reject, 500, ‘promise3‘); }); let promise4 = new Promise((resolve, reject) => { setTimeout(reject, 100, ‘promise4‘); }); Promise.race([promise1, promise2]).then((value) => { console.log(value); //promise2 100 <promise1 500 所以输出: promise2 }); Promise.race([promise3, promise4]).then((value) => { }, (rejected) => { console.log(rejected) //promise4 100 < promise3 500 所以输出: promise4 }); Promise.race([promise2, promise3]).then((value) => { console.log(value) //promise2 100 < promise3 500 所以会走成功状态,输出: promise2 }, (rejected) => { console.log(rejected) }); Promise.race([promise1, promise4]).then((value) => { console.log(value) }, (rejected) => { console.log(rejected) //promise4 100 < promise1 500 所以会走失败状态,输出: promise4 });

  5、Promise.prototype.catch()

  返回一个Promise,并且处理拒绝的情况

  栗子:

 let promise = new Promise((resolve, reject) => {
    setTimeout(resolve, 500, ‘promise‘);
  });
  promise.then((value) => {
    console.log(value);    //promise
    throw ‘抛出一个异常‘     //通过throw 抛出
  }).catch((e) => {
    console.log(e)    //输出: 抛出一个异常
  })

  注意:

  在异步函数中抛出的错误不会被catch捕获到

 let promise1 = new Promise((resolve, reject) => {
    setTimeout(() => {
      throw ‘抛出一个异常‘;
    }, 1000)
  });
  promise1.catch((e) => {
    console.log(e)  //不会执行
  })

  在resolve后面抛出的错误会被忽略

let promise2 = new Promise((resolve, reject) => {
    resolve()
    throw ‘抛出异常‘
  });
  promise2.catch((e) => {
    console.log(e)  //不会执行
  })

 

以上是关于Promise简介以及常用方法的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段12——JavaScript的Promise对象

VSCode自定义代码片段12——JavaScript的Promise对象

IOS开发-OC学习-常用功能代码片段整理

前端面试题之手写promise

JS手写面试题 --- Promise 以及相关方法的实现

常用python日期日志获取内容循环的代码片段