目录

异步和同步

异步的问题

new Promise语法

promise的状态

promise.then()

Promise.resolve()

Promise.reject()

Promise.all()

Promise.race()

Promise.catch()

Promise.finally()


异步和同步

同步模式下,代码按顺序执行,前一条执行完毕后,进行后一条的执行。

异步模式下,代码可以不按顺序执行,不同行的代码可以同时执行。

异步的问题

有时,一条代码需要一个异步操作的返回值才能进行计算,这就会导致回调问题,promise语法可以优雅地解决回调。

new Promise语法

new Promise用于创建Promise实例,其参数是一个函数。

const demo = new Promise( ( resolve, reject )=>{if(){...resolve();    }if(){...reject();}}
)

作为参数的函数接收两个参数。为resolve和reject(参数名可以修改,但一般都用resolve和reject),resolve和reject也为函数。

promise的状态

promise实例具有三个状态:成功(fulfilled,但有时也叫resolved)、失败、待定。

当调用resolve()函数时,promise的状态会变成成功。

当调用reject()函数时,promise的状态会变为失败。

当promise的状态为成功或失败时,会进入Promise.then()。

在new Promise中,若调用throw,会触发reject状态。

        let a = new Promise((resolve,reject)=>{throw Error('error!');});console.log(a);

promise.then()

接收两个参数,第一个参数是promise状态变为成功时,执行的函数,第二个参数是promise状态为失败时调用的函数。

demo.then(()=>{//如果resolve被触发,执行的函数},()=>{//如果reject被触发,执行的函数}
)

传参

在new Promise参数函数中,reject和resolve可以传递参数,在.then对应的处理函数中,可以获得这个参数,且两个参数的名称不需要对应。

    const demo = new Promise( ( resolve, reject )=>{if(){...resolve(num1);    }if(){...reject(num2);}}).then((resolveData)=>{...},(rejectData)=>{})

.then中的参数名resolveData和rejectData是可以修改的,这里只是随便起的名字,不是一定要叫这个。

Promise.resolve()

Promise.resolve()方法返回一个Promise对象。

Promise.resolve的参数为非Promise参数时,其返回的Promise对象状态为成功,值为传入的参数。

若Promise.resolve的参数为Promise参数,其返回的Promise对象的状态与值,取决于参数Promise。

        let a = Promise.resolve(1);let b = Promise.resolve(function(){return 1+1;});let c = Promise.resolve(new Promise((resolve,reject)=>{reject();}));console.log(a);console.log(b);console.log(c);

Promise.reject()

与Promise.resolve()类似。

但与resolve不同的是,不管传入的参数如何,返回的Promise状态都是失败。

传入的参数是什么,该参数的返回值会成为返回的Promise的值。

即使传入的参数是成功的Promise对象,返回值也是失败的Promise。

        let a = Promise.reject(new Promise((resolve,reject)=>{resolve("resolve!!!");}));console.log(a);

当传入的参数是成功的Promise,这个Promise会作为失败Promise的值。但返回的Promise状态仍然是失败。

当传入的参数是失败的Promise,整个失败的Promise会作为返回的Promise的值。

        let a = Promise.reject(new Promise((resolve,reject)=>{reject("reject!!!");}));console.log(a);

Promise.all()

Promise.all()方法接收一个数组。

该数组一般情况下,其中每一个元素都是Promise。

其返回的结果也是Promise,只有当数组中所有的Promise都成功时,才返回成功,成功的结果是每个Promise对象成功结果组成的一个数组,否则返回失败,失败的结果是第一个失败的Promise的结果。

Promise全成功的情况下:

若传入的参数不是Promise,则该参数会被视为成功值。

        let p1 = Promise.resolve(1);let p2 = 2;let p3 = Promise.resolve(3);let p4 = new Promise((resolve,reject)=>{resolve('ok');});let a = Promise.all([p1,p2,p3,p4]);console.log(a);

有失败Promise的情况下:

        let p1 = Promise.resolve(1);let p2 = 2;let p3 = Promise.reject(3);let p4 = new Promise((resolve,reject)=>{resolve('ok');});let p5 = new Promise((resolve,reject)=>{reject('reject');})let a = Promise.all([p1,p2,p3,p4,p5]);console.log(a);

Promise.race()

Promise.race()方法接收一个数组。

该数组一般也都由Promise组成。返回值为第一个改变状态的Promise。

当数组元素为非Promise结构时,该非Promise结构会被视为成功的Promise并返回。

        let p1 = Promise.resolve(1);let p2 = null;let p3 = Promise.reject(3);let p4 = new Promise((resolve,reject)=>{resolve('ok');});let p5 = new Promise((resolve,reject)=>{reject('reject');})let a = Promise.race([p2,p1]);

Promise.catch()

Promise.catch()的语法有点像语法糖。

Promise.catch(reject)从语法上讲,相当于promise.then(null, reject),这里的reject都是指处理reject状态的回调函数。

.catch返回值也是一个Promise。

Promise.finally()

Promise.finally()方法,不论Promise的状态是成功还是失败,在最后都会调用finally中的方法。

finally可以用于处理不论返回结果如何,都需要执行的逻辑,可以避免代码冗余。

finally接收的是一个函数。

finally的返回值是一个新的Promise实例对象。

该对象的状态一般是父Promise状态的传递。父Promise是指promise.finally中,promise对应的实例。但当finally的返回值是显式reject或pending Promise时,返回值是reject或pending。

下例中,pTest的返回值是一个状态为失败的Promise,调用pTest时,虽然finally参数的返回值是成功的promise,但是由于该promise的状态不是失败或待定,所以finally的返回值取决于父Promise,即pTest。

        let pTest = new Promise((resolve,reject)=>{reject('error');});console.log(pTest.finally( ()=>{return new Promise((resolve,reject)=>{resolve('ok');})}));

但若finally参数返回的是reject或者pending,则返回值取决于参数。

参数返回reject的情况下:

        let pTest = new Promise((resolve,reject)=>{reject('error');});console.log(pTest.finally( ()=>{return new Promise((resolve,reject)=>{reject('reject');})}));

参数返回panding的情况下:

        let pTest = new Promise((resolve,reject)=>{reject('error');});console.log(pTest.finally( ()=>{return new Promise((resolve,reject)=>{})}));

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/diannao/91294.shtml
繁体地址,请注明出处:http://hk.pswp.cn/diannao/91294.shtml
英文地址,请注明出处:http://en.pswp.cn/diannao/91294.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

用TensorFlow进行逻辑回归(六)

import tensorflow as tfimport numpy as npfrom tensorflow.keras.datasets import mnistimport time# MNIST数据集参数num_classes 10 # 数字0到9, 10类num_features 784 # 28*28# 训练参数learning_rate 0.01training_steps 1000batch_size 256display_step 50# 预处…

【HTTP版本演变】

在浏览器中输入URL并按回车之后会发生什么1. 输入URL并解析输入URL后,浏览器会解析出协议、主机、端口、路径等信息,并构造一个HTTP请求(浏览器会根据请求头判断是否又HTTP缓存,并根据是否有缓存决定从服务器获取资源还是使用缓存…

Android 16系统源码_窗口动画(一)窗口过渡动画层级图分析

一 窗口过渡动画 1.1 案例效果图1.2 案例源码 1.2.1 添加权限 (AndroidManifest.xml) <!-- 系统悬浮窗权限&#xff08;Android 6.0需动态请求&#xff09; --> <uses-permission android:name"android.permission.SYSTEM_ALERT_WINDOW" />1.2.2 窗口显示…

腾讯云WAF域名分级防护实战笔记

基于业务风险等级、合规要求及腾讯云最佳实践&#xff0c;提供可直接落地的配置方案&#xff0c;供学习借鉴&#xff1a;一、域名分级与防护原则1. ​域名分级清单&#xff08;核心资产&#xff09;​​​主域名​​业务类型​​风险等级​​合规要求​​防护等级​example.com…

1. 请说出你知道的水平垂直居中的方法

总结 容器 flex 布局&#xff0c;jsutify-content: center; align-items: center;容器 flex 布局&#xff0c;子项 margin: auto;容器 relative 布局&#xff0c;子项 absolute 布局&#xff0c;left: 50%; top: 50%; transform: translate(-50%, -50%);子项 absolute 布局&…

VS Code `launch.json` 完整配置指南:参数详解 + 配置实例

文章目录&#x1f4e6; 一、基本结构&#x1f50d; 二、单个配置项详解示例配置&#xff1a;&#x1f9e9; 三、字段说明与可选值&#x1f4c1; 四、常用变量&#xff08;宏替换&#xff09;&#x1f6e0;️ 五、常见配置实例1️⃣ 调试当前打开的 .py 文件2️⃣ 调试 Jupyter …

使用浏览器inspect调试wx小程序

edge://inspect/#devices调试wx小程序 背景&#xff1a; 在开发混合项目的过程中&#xff0c;常常需要在app环境排查问题&#xff0c;接口可以使用fiddler等工具来抓包&#xff0c;但是js错误就不好抓包了&#xff0c;这里介绍一种调试工具-浏览器。 调试过程 首先电脑打开edg…

【论文阅读】-《Simple Black-box Adversarial Attacks》

简单黑盒对抗攻击 Chuan Guo Jacob R. Gardner Yurong You Andrew Gordon Wilson Kilian Q. Weinberger 摘要 我们提出了一种在黑盒&#xff08;black-box&#xff09;场景下构建对抗样本&#xff08;adversarial images&#xff09;的极其简单的方法。与白盒&#xff08;…

基于ASP.NET+SQL Server实现(Web)企业进销存管理系统

企业进销存管理系统的设计和实现一、摘要进销存管理是现代企业生产经营中的重要环节&#xff0c;是完成企业资源配置的重要管理工作&#xff0c;对企业生产经营效率的最大化发挥着重要作用。本文以我国中小企业的进销存管理为研究对象&#xff0c;描述了企业进销存管理系统从需…

(LeetCode 面试经典 150 题 ) 15. 三数之和 (排序+双指针)

题目&#xff1a;15. 三数之和 思路&#xff1a;排序双指针&#xff0c;时间复杂度0(n^2nlogn)。 先将数组nums升序排序&#xff0c;方便去重和使用双指针。第一层for循环来枚举第一位数&#xff0c;后面使用双指针来找到第二个、第三个数即可&#xff0c;细节看注释。 C版本…

easy-springdoc

介绍 简化springdoc的使用&#xff08;可以搭配knife4j-openapi3-jakarta-spring-boot-starter一起使用&#xff09; maven引用 <dependency><groupId>io.github.xiaoyudeguang</groupId><artifactId>easy-springdoc</artifactId><version>…

配置nodejs,若依

1.配置node.js环境 Node.js — Download Node.js 1.下载好一路下一步&#xff0c;可以安装到d盘 装完之后执行 npm -v 显示版本号即安装成功 2.安装好后新建两个文件夹&#xff0c;node_cache和node_global 3.配置环境变量 新建变量 在path里编辑变量 4.配置用户变量 5.…

Python学习之路(十二)-开发和优化处理大数据量接口

文章目录一、接口设计原则二、性能优化策略1. 数据库优化2. 缓存机制3. 并发模型三、内存管理技巧1. 内存优化实践2. 避免内存泄漏四、接口测试与监控1. 性能测试2. 日志与监控3. 错误处理与限流五、代码示例&#xff08;Flask 流式处理&#xff09;六、部署建议一、接口设计原…

【实时Linux实战系列】实时数据流的网络传输

在实时系统中&#xff0c;数据流的实时传输是许多应用场景的核心需求之一。无论是工业自动化中的传感器数据、金融交易中的高频数据&#xff0c;还是多媒体应用中的视频流&#xff0c;都需要在严格的时间约束内完成数据的传输。实时数据流的传输不仅要求高吞吐量&#xff0c;还…

C#数组(一维数组、多维数组、交错数组、参数数组)

在 C# 中&#xff0c;数组是一种用于存储固定大小的相同类型元素的集合。数组可以包含值类型、引用类型或对象类型的元素&#xff0c;并且在内存中是连续存储的。以下是关于 C# 数组的详细介绍&#xff1a;1. 一维数组声明与初始化// 声明数组 int[] numbers; // 声…

Dify离线安装包-集成全部插件、模板和依赖组件,方便安可内网使用

项目介绍 Dify一键离线安装包&#xff0c;集成安装了全部插件、模板&#xff0c;并集成了dify全部插件所需的依赖组件。方便你在内网、安可环境等离线状态下使用。 Dify是一个开源的LLM应用开发平台。其直观的界面结合了AI工作流、RAG管道、Agent、模型管理、可观测性功能等&…

面试150 翻转二叉树

思路 采用先序遍历&#xff0c;可以通过新建根节点node&#xff0c;将原来root的右子树连到去node的左子树中&#xff0c;root的左子树连到去node的右子树中。 # Definition for a binary tree node. # class TreeNode: # def __init__(self, val0, leftNone, rightNone): …

C++-linux系统编程 3.gcc编译工具

GCC编译工具链完全指南 GCC&#xff08;GNU Compiler Collection&#xff09;是Linux系统下最常用的编译器套件&#xff0c;支持C、C、Objective-C等多种编程语言。本章将深入讲解GCC的编译流程、常用选项及项目实战技巧。 一、GCC编译的四个核心阶段 GCC编译一个程序需要经过四…

uView UI 组件大全

uView UI 是一个基于 uni-app 的高质量 UI 组件库&#xff0c;提供丰富的跨平台组件&#xff08;支持 H5、小程序、App 等&#xff09;。以下是其核心组件的分类大全及功能说明&#xff0c;结合最新版本&#xff08;1.2.10&#xff09;整理&#xff1a; &#x1f4e6; 一、基础…

QWidget 和 QML 的本质和使用上的区别

QWidget 和 QML 是 Qt 框架中两种不同的 UI 开发技术&#xff0c;它们在底层实现、设计理念和使用场景上有显著区别。以下是它们的本质和主要差异&#xff1a;1. 本质区别特性QWidgetQML (Qt Modeling Language)技术基础基于 C 的面向对象控件库基于声明式语言&#xff08;类似…