什么是Promise

Promise是异步编程的一个解决方案:从语法上讲它是一个对象,可以获取到异步操作的消息,从本意上讲,它是一个承诺,承诺过一段时间后它会给你一个结果。Promise有三种状态:pending(等待),fulfilled(成功),rejected(失败),状态一旦改变就不会再变,创建Promise后会立即执行。

为什么要使用Promise

避免回调地狱

// 请求 代表 一个异步网络调用。
// 请求结果 代表网络请求的响应。

请求1(function(请求结果1){
   请求2(function(请求结果2){
       请求3(function(请求结果3){
           请求4(function(请求结果4){
               请求5(function(请求结果5){
                   请求6(function(请求结果3){
                       ...
                  })
              })
          })
      })
  })
})

解决办法

new Promise(请求1)
  .then(请求2(请求结果1))
  .then(请求3(请求结果2))
  .then(请求4(请求结果3))
  .then(请求5(请求结果4))
  .catch(处理异常(异常信息))

Promise 的常用 API

  • Promise.resolve(value)

类方法,该方法返回一个以 value 值解析后的 Promise 对象

1、如果这个值是个 thenable(即带有 then 方法),返回的 Promise 对象会“跟随”这个 thenable 的对象,采用它的最终状态(指fulfilled/rejected/pending)

2、如果传入的 value 本身就是 Promise 对象,则该对象作为 Promise.resolve 方法的返回值返回。

3、其他情况以该值为成功状态返回一个 Promise 对象。

let p0=Promise.resolve('success');
p0.then(
   res=>{
       console.log(res);
  },
   err=>{
       console.log(err);
  }
)
// success
// 和p1效果相同
let p1=new Promise((resolve,reject)=>{
   resolve('success')
})
p1.then(
   res=>{
       console.log(res);
  },
   err=>{
       console.log(err);
  }
)
// success

//如果传入的 value 本身就是 Promise 对象,则该对象作为 Promise.resolve 方法的返回值返回。  
function fn(resolve){
   setTimeout(function(){
       resolve(123);
  },3000);
}
let p2 = new Promise(fn);
let p3 = Promise.resolve(p2);
// 返回为true,返回的 Promise 即是 入参的 Promise 对象。
console.log(p2 === p3);
// true
  • Promise.reject

类方法,且与 resolve 唯一的不同是,返回的 promise 对象的状态为 rejected。

  • Promise.prototype.then

实例方法,为 Promise 注册回调函数,函数形式:fn(vlaue){},value 是上一个任务的返回结果,then 中的函数一定要 return 一个结果或者一个新的 Promise 对象,才可以让之后的then 回调接收。

  • Promise.prototype.catch

实例方法,捕获异常,函数形式:fn(err){}, err 是 catch 注册 之前的回调抛出的异常信息。

let p=Promise.resolve('0 success');
p.then(
   res=>{
       console.log(res);
       return '1 success'
  }
)
.then(res=>{
   console.log(res);
   throw new Error('2 error')
})

.catch(err=>{
   console.log('catch',err);
})
// 0 success
// 1 success
// catch Error: 2 error

catch方法可以统一捕获then链式调用中产生的错误

  • Promise.finally

实例方法,用于指定不管Promise对象最后状态如何,都会执行的操作,不管Promise最后的状态,在执行完then或者catch指定的回调以后都会执行finally方法。可以进行任何必要的清理工作

let p=Promise.resolve('0 success');
p.then(
   res=>{
       console.log(res);
       return '1 success'
  }
)
.then(res=>{
   console.log(res);
   throw new Error('2 error')
})

.catch(err=>{
   console.log('catch',err);
})
.finally(()=>{
   console.log('p finally');
})
// 0 success
// 1 success
// catch Error: 2 error
// p finally
  • Promise.all([...])

类方法,多个 Promise 任务同时执行,返回最先执行结束的 Promise 任务的结果,不管这个 Promise 结果是成功还是失败。 。

let p1 = Promise.resolve('p1 success');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.all(arr)
  .then(
       res => {
           console.log(res);
      },
       err => {
           console.log(err);
      }
  )
   // p3 error
  • Promise.race([...])

类方法,多个 Promise 任务同时执行,返回最先执行结束的 Promise 任务的结果,不管这个 Promise 结果是成功还是失败。

let p1 = Promise.resolve('p1 success');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.race(arr)
  .then(
       res => {
           console.log(res);
      },
       err => {
           console.log(err);
      }
  )
   // p1 success
  • Promise.any([...])

与all相似,但是会忽略拒绝,所以只需要完成一个而不是全部

let p1 = Promise.reject('p1 error');
let p2 = Promise.resolve('p2 success');
let p3 = Promise.reject('p3 error')
let arr = [p1, p2, p3]
Promise.any(arr)
  .then(
       res => {
           console.log(res);
      },
       err => {
           console.log(err);
      }
  )
// p2 success

变式

Promise.none([...])

类似于all不过完成和拒绝的情况互换,只有所有的函数都被拒绝,该函数转化为完成值,反之亦然

Promise.first([...])

类似于any的竞争,只要第一个Promise完成,会忽略后边任何的拒绝和完成

Promise.last([...])

类似于first,但是只有最后一个完成胜出

简单认识Promise的更多相关文章

  1. 一个简单的Promise 实现

    用了这么长时间的promise,也看了很多关于promise 的文章博客,对promise 算是些了解.但是要更深的理解promise,最好的办法还是自己实现一个. 我大概清楚promise 是对异步 ...

  2. 实现简单的promise

    只考虑成功时的调用,方便理解一下promise的原理promise的例子: 1. 接下来一步步实现一个简单的promise step1:promise 接受一个函数作为构造函数的参数,是立即执行的,并 ...

  3. 如何用原生JS实现一个简单的promise

    我又又又回来了,最近真是累的跟狗一样,急需一个大保健回复一下子精力 我现在是一边喝着红牛一边写着博客,好了好了,不扯了,回归整体好吧 先简单来说一下啥是promise吧 它是什么?Promise是一个 ...

  4. 简单版 Promise/A+,通过官方872个测试用例

    promise 标准 在实现 Promise 之前要清楚的是 JavaScript 中的 Promise 遵循了 Promises/A+ 规范,所以我们在编写 Promise 时也应当遵循这个规范,建 ...

  5. 聊一聊看似简单的Promise.prototype.then()方法

    Promise.prototype.then() Proise实例的then方法是定义在原型对象Promise.prototype上的,它的作用是为Promise实例添加状态改变时的回调函数. 该方法 ...

  6. 简单模拟 Promise

    class promise { constructor(fn) { this.data = null; this.err = null; this.isPromise = false; this.er ...

  7. [手写系列] 带你实现一个简单的Promise

    简介 学习之前 需要先对Promise有个基本了解哦,这里都默认大家都是比较熟悉Promise的 本次将带小伙伴们实现Promise的基本功能 Promise的基本骨架 Promise的then Pr ...

  8. 简单的 Promise 实现

    参考 http://www.tuicool.com/articles/RzQRV3 var PENDING = undefined, FULLFILLED = 1, REJECTED = 2; var ...

  9. 简单的 Promise 实现 一

    const Promise = function(fn){ let state = { pending: "pending", fulfilled: "fulfilled ...

  10. 手写简单的promise

    function Promise(fn) { var that = this; this.status = "pedding"; this.value = undefined; / ...

随机推荐

  1. Pytorch实践模型训练(损失函数)

    一个深度学习项目包括了: 模型设计.损失函数设计.梯度更新方法.模型保存和加载和模型训练,其中损失函数就像一把衡量模型学习效果的尺子,训练模型的过程就是优化损失函数的过程,模型拿到数据之后有一个非常重 ...

  2. 使用 Transformers 进行图分类

    在之前的 博文 中,我们探讨了图机器学习的一些理论知识.这一篇我们将探索如何使用 Transformers 库进行图分类.(你也可以从 此处 下载演示 notebook,跟着一起做!) 目前,Tran ...

  3. Puppeteer+RabbitMQ:Node.js 批量加工pdf服务架构设计与落地

    全文约8500字,阅读时长约10分钟. 智慧作业最近上线「个性化手册」(简称个册)功能,一份完整的个性化手册分为三部分: •学情分析:根据学生阶段性的学习和考试情况进行学情分析.归纳.总结,汇总学情数 ...

  4. 【解决方法】查找比较组时报错:An object (User, Group, or Built-in security principal) with the following nameca..

    目录-快速跳转 问题描述 原因分析: 解决方案: 附言: 问题描述 操作环境与场景: 在 VM 内 Windows 2019 中,在组策略管理中,对GPO进行组查找时报错: An object (Us ...

  5. 掌握这些GitHub搜索技巧,你的开发效率将翻倍!

    作为开发it行业一员,学习借鉴他人项目是很有必要的,所以我们一般都会从github或者 Gitee 上面去参考借鉴他人的项目来学习增加自己的项目经验 但是github你真的用对了嘛,他的功能其实很强大 ...

  6. 试用「ChatGPT」几周之后

    冷静下来,不吹不黑. 01 最近半年,互联网一款现象级的应用诞生:「ChatGPT」: 其火爆的程度,不输前面的羊了个羊: 最初了解到ChatGPT还是春节的时候,但那时网上的测评还没引起足够的好奇心 ...

  7. C++ | 类继承

    1. 概述 C++有3种继承方式:公有继承(public).保护继承(protected).私有继承(private). 一个B类继承于A类,或称从类A派生类B.这样的话,类A称为基类(父类),类B称 ...

  8. React项目build

    1.项目根目录下新建app.js文件 // 使用 express 搭建一个服务器 const express = require("express"); const { creat ...

  9. 2023-04-15:ffmpeg的filter_audio.c的功能是生成一个正弦波音频,然后通过简单的滤镜链,最后输出数据的MD5校验和。请用go语言改写。

    2023-04-15:ffmpeg的filter_audio.c的功能是生成一个正弦波音频,然后通过简单的滤镜链,最后输出数据的MD5校验和.请用go语言改写. 答案2023-04-15: 代码见gi ...

  10. Django-管理员用户的创建

    命令:python manage.py createsuperuser python manage.py createsuperuser Type 'manage.py help' for usage ...