【JavaScript】Promise

news/2025/1/11 14:54:14/

文章目录

    • 一. Promise
    • 二. try/catch/finally
    • 三. async/await

一. Promise

  • promise 是一个 ES6 的语法

  • 承诺的意思,是一个专门用来解决异步 回调地狱 的问题

  • 语法:

    new Promise(function (resolve, reject) {// resolve 表示成功的回调// reject 表示失败的回调
    }).then(function (res) {// 成功的函数
    }).catch(function (err) {// 失败的函数
    })
    
  • promise 就是一个语法

    • Promise 代表一个异步操作,有三种状态:pending进行中、fulfilled(resolve)成功、rejected失败。
    • 对象的状态不受外界影响,一旦状态设定,就不会再变。
    • Promise对象的状态改变有两种可能:从pending变为fulfilled和从pending变为rejected。
  • promise原型下面三个常用的方法:

    • Promise.prototype.then

      • Promise.prototype.catch
      • Promise.prototype.finally
    • promise对象下面的静态方法:

    • Promise.all

      用于将多个 Promise 实例,包装成一个新的 Promise 实例,接受一个数组作为参数,只有数组里面的每个状态都变成resolve,则新的 Promise 实例状态才会变成resolve.

    • Promise.race

      方法同样是将多个 Promise 实例,包装成一个新的 Promise 实例,接受一个数组作为参数,只要其中有一个实例率先改变状态,则整个的状态就跟着改变。

    • Promise.resolve

    有时需要将现有对象转为 Promise 对象,该方法就起到这个作用。

     - Promise.reject
    
    方法也会返回一个新的 Promise 实例,该实例的状态为rejected。
    promise 来解决多个 ajax 发送的问题
    new Promise(function (resolve, reject) {
    ajax({url: '第一个请求',success (res) {resolve(res)
    }
    })
    }).then(function (res) {
    // 准备发送第二个请求
    return new Promise(function (resolve, reject) {
    ajax({url: '第二个请求',data: { a: res.a, b: res.b },success (res) {resolve(res)}})
    })
    }).then(function (res) {
    ajax({url: '第三个请求',data: { a: res.a, b: res.b },success (res) {console.log(res)}
    })
    })
    

二. try/catch/finally

  • try/catch/finally 语句用于处理代码中可能出现的错误信息。
  • 如果try里面的代码有错误,那么就执行catch里面的代码,同时catch的参数会返回try里面的错误信息。
  • finally 语句在 try 和 catch 之后无论有无异常都会执行。
  • 注意:
    • catch 和 finally 语句都是可选的,但你在使用 try 语句时必须至少使用一个。
    • try、catch、finally三段代码中都含有return时,则以finally中的retrun为准,其它return均无效;但是其它return之前的代码有效。
    • try和catch中含有return,但是finally中不含return;则代码会在执行try/catch中return之前去执行finally中的代码块,然后再执行try中的return操作

三. async/await

  • async/await 是一个 es7 的语法

  • async 其实就是promise的语法糖。函数前面必须加一个async,异步操作的方法前加一个await 关键字。顾名思义,就是让你等一下,执行完了再继续往下走。注意:await 只能在async函数中执行,否则会报错。

  • async:异步的意思,作用是申明一个异步函数,函数的返回值是promise 对象

  • await:等待

    await是 async+wait 的结合 即异步等待,async和await 二者必须是结合着使用

    await就是promise里面then的语法糖。

    await直接拿到promise的返回值。

    async和await在一个函数中存在。

    匿名函数也可以使用async和await.

  • 这个语法是 回调地狱的终极解决方案

  • 语法:

    async function fn() {const res = await promise对象
    }
    
  • 这个是一个特殊的函数方式

  • 可以 await 一个 promise 对象

  • 可以把异步代码写的看起来像同步代码

  • 只要是一个 promiser 对象,那么我们就可以使用 async/await 来书写

    async function fn() {const res = new Promise(function (resolve, reject) {ajax({url: '第一个地址',success (res) {resolve(res)}})})// res 就可以得到请求的结果const res2 = new Promise(function (resolve, reject) {ajax({url: '第二个地址',data: { a: res.a, b: res.b },success (res) {resolve(res)}})})const res3 = new Promise(function (resolve, reject) {ajax({url: '第三个地址',data: { a: res2.a, b: res2.b },success (res) {resolve(res)}})})// res3 就是我们要的结果console.log(res3)
    }
    
    • 这样的异步代码写的就看起来像一个同步代码了

http://www.ppmy.cn/news/6931.html

相关文章

Python实现将位图描摹为彩色矢量 svg 图片的源代码,Python实现位图转彩色矢量代码

Color Trace 这是一个将位图描摹为彩色矢量 svg 图片的程序,是一个命令行工具,使用 Python 脚本实现,运行环境 Python3.8。 ✨ 效果 以一个字帖图片为例,这是 png 格式的位图(370KB): 这是颜…

三菱FX5U系列PLC与汇川IT6000系列触摸屏进行MODBUS TCP通信的具体方法

三菱FX5U系列PLC与汇川IT6000系列触摸屏进行MODBUS TCP通信的具体方法 本次和大家分享三菱FX5U系列PLC与汇川IT6000系列触摸屏进行MODBUS TCP通信的具体方法,由于汇川IT6000系列触摸屏组态软件中没有三菱FX5U系列PLC的连接驱动,所以采用MODBUS TCP通信的方式实现。 具体步骤可…

OpenCV 图像旋转、平移、缩放

本文是 OpenCV图像视觉入门之路的第7篇文章,本文详细的进行了图像的缩放 cv2.resize()、旋转 cv2.flip()、平移 cv2.warpAffine()等操作。 OpenCV 图像旋转、平移、缩放目录 1 缩放图片 2 翻转图片 2.1 垂直翻转 2.2 水平翻转 2.3 水平垂直翻转 ​编辑 3 平移…

【docker常用命令】

一、帮助启动类命令 (1)启动docker systemctl start docker(2)停止docker systemctl stop docker(3)重启docker systemctl restart docker(4)查看docker状态 systemctl status…

JAVA零基础小白学习教程之day09-内部类权限final静态

day09-JAVAOOP 课程目标 1. 【理解】什么是内部类 2. 【掌握】匿名内部类 3. 【掌握】引用数据类型作为方法的参数 4. 【理解】final关键字的使用 5. 【理解】包的定义及使用 6. 【理解】权限修饰符 7. 【掌握】static关键字的使用B友https://www.bilibili.com/video/BV1QG4y…

SpringCloud 协同开发方案

相比Springboot开发,SpringCloud开发要复杂的多,因为涉及服务的注册发现,多个微服务模块间的调用等。 最简单的解决方案是每个开发者都在本地启动一套完整的开发环境,包括网关、nacos等各个组成微服务的模块,如果系统…

kubernetes常用命令

kubernetes常用命令 参考1 以kubesphere单节点集群结果为例 # kubectl get pod -A NAMESPACE NAME READY STATUS RESTARTS AGE kube-system calico-kube-controllers-846…

Okhttp源码分析实践(八)【 实践环节:Okhttp断点下载功能的实现 】

上文,我们通过自己编写的okhttp框架,实现了下载功能,这节,我们在此基础上,一起来实现断点下载功能。 OkhttpStudy Demo Github源码 1. 需求及思考 需求:文件下载中途由于一些原因,停止下载,在异常原因(网络中断、暂停下载)解除之后,继续下载文件,可以接着目前的进…