当前位置: 首页 > news >正文

令人疑惑的Promise相关问题

令人疑惑的Promise相关问题

问题1

const promise = new Promise((resolve, reject) => {reject(Error('Error occurred'));
});promise.catch(error => console.log(error.message));
promise.catch(error => console.log(error.message));

输出:

Error occurred
Error occurred

解释:

  1. Promise 创建后立即被拒绝,并显示错误消息“发生错误”。
  2. Promise 附加了两个catch处理程序,当 Promise 被拒绝时,每个处理程序都会将错误消息记录到控制台。
  3. 由于 Promise 被拒绝,因此两个catch处理程序都将被执行,从而导致错误消息被记录两次。

问题2

console.log('start')const promise1 = new Promise((resolve, reject)=>{console.log(1)
})
console.log('end')

输出:

start
1
end

解释:

  1. console.log(‘start’)语句首先执行,并将“start”记录到控制台。
  2. 构造Promise函数被调用,但它不包含任何异步操作或对 resolve 或 reject 的调用。因此,构造函数内的console.log(1)语句是同步执行的。
  3. 最后,console.log(‘end’)执行,将“end”记录到控制台。

请记住,如果没有异步操作对Promise构造函数中 resolve 或 reject的进行调用,则 Promise 被视为立即解决,并且其行为是同步的。

问题3

function performTask() {return new Promise(function(resolve, reject) {reject()})
}let taskPromise = performTask();taskPromise.then(function() {console.log('success 1')}).then(function() {console.log('success 2')}).then(function() {console.log('success 3')}).catch(function() {console.log('error 1')}).then(function() {console.log('success 4')})

输出:

error 1
success 4

解释:

  1. performTask函数返回一个立即被拒绝的 Promise。
  2. 前三个.then()块被跳过,因为 Promise 被拒绝。
  3. .catch()块捕获拒绝并记录“错误 1”。
  4. 尽管出现错误,最后一个.then()块仍会执行,并将“Success 4”记录到控制台。这种行为是因为.catch()仅捕获前面的 Promise 链中的错误,而.then()无论之前的错误如何,都会执行后续块。

问题4

const promise = new Promise((resolve) => {resolve(1);
});promise.then((value) => {console.log(value);return value + 1;
}).then((value) => {console.log(value);throw new Error('Something went wrong');
}).catch((error) => {console.error(error.message);
});
1
2
Error: Something went wrong

解释:

  1. 第一个 .then() 记录1到控制台并返回 value + 1,即2。
  2. 第二个 .then() 记录2到控制台,然后故意抛出错误。
  3. 错误被.catch()块捕获,并且错误消息 Something went wrong 被记录到控制台。

此代码说明了异步操作与 Promise 的链接以及 .catch() 块如何捕获链中的错误。

问题5

const promise = new Promise(function(resolve, reject){setTimeout(function() {resolve('Resolved!');}, 1000);
});promise.then(function(value) {console.log(value)
});

输出:

# 1秒后打印
Resolved!

解释:

  1. setTimeout引入了延迟,使得 Promise 在 1000 毫秒后解析。
  2. 当 Promise 被解析时,.then() 块被执行,并且将 Resolved! 记录到控制台。

问题6

const promise = new Promise(function(resolve, reject){setTimeout(() => resolve(1), 1000);
});promise.then(function(result){console.log(result);return result * 2;}).then(function(result){console.log(result);return result * 2;}).then(function(result){console.log(result);return result * 2;});

输出:

1
2
4

解释:

  1. 在用值解析 Promise 之前引入 setTimeout 并设置了 1000 毫秒的延迟。
  2. 每个 .then() 块对先前的结果执行操作并记录更新的值。
  3. 处理程序的链接 .then() 允许顺序处理异步结果。

问题7

console.log('Start');
setTimeout(() => {console.log('Timeout');
}, 0);
Promise.resolve().then(() => {console.log('Promise resolved');
});
console.log('End');

输出:

Start
End
Promise resolved
Timeout

解释:

  1. console.log(‘Start’);:同步操作,将“Start”记录到控制台。
  2. setTimeout(() => { console.log(‘Timeout’); }, 0);:使用 setTimeout 异步操作。即使超时设置为0毫秒,当前同步代码执行完毕后仍然会执行。将 Timeout 记录到控制台。
  3. Promise.resolve().then(() => { console.log(‘Promise resolved’); });:使用已解析的 Promise 进行异步操作。这将在当前同步代码之后的事件循环的下一个周期中执行。将 Promise resolved 记录到控制台。
  4. console.log(‘End’);:同步操作,将 End 记录到控制台。

问题8

let firstTask = new Promise(function(resolve, reject) {setTimeout(resolve, 500, 'Task One');
});let secondTask;let thirdTask = new Promise(function(resolve, reject) {setTimeout(resolve, 1200, 'Task Three');
});let fourthTask = new Promise(function(resolve, reject) {setTimeout(reject, 300, 'Task Four');
});let fifthTask = new Promise(function(resolve, reject) {setTimeout(resolve, 1000, 'Task Two');
});let combinedPromise = Promise.all([firstTask, secondTask, thirdTask, fourthTask, fifthTask]);combinedPromise.then(function(data) {data.forEach(function(value) {console.log('Result:', value);});}).catch(function(error) {console.error('Error:', error);});

输出:

Error: Task Four

解释:

  1. 500 毫秒后解析firstTask值为’Task One’。
  2. secondTask未初始化,因此它被视为具有 undefined 值的已解决的 Promise。
  3. 1200 毫秒后解析 thirdTask 值为’Task Three’。
  4. 设置 fourthTask 为在 300 毫秒后拒绝,值为’Task Four’。
  5. 1000 毫秒后解析 fifthTask 值为’Task Two’。

问题9

const promise1 = new Promise(resolve => setTimeout(resolve, 100, 'One'));
const promise2 = new Promise(resolve => setTimeout(resolve, 200, 'Two'));Promise.race([promise1, promise2]).then(value => console.log(value)).catch(error => console.error(error));

输出:

One

解释:

  1. 创建两个 Promise(promise1和promise2)并使用 setTimeout 来模拟异步操作。
  2. 用于Promise.race解决或拒绝第一个已解决的承诺(解决或拒绝)。
  3. 在这种情况下,promise1首先返回结果(100 毫秒后),因此 .then 块被执行,并将“One”记录到控制台。
  4. 由于没有拒绝,因此不会触发 .catch 块。

问题10

const promise1 = Promise.resolve(1);
const promise2 = new Promise(resolve => setTimeout(resolve, 200));
const promise3 = new Promise((resolve, reject) => setTimeout(reject, 100, 'Error'));Promise.all([promise1, promise2, promise3]).then(values => console.log(values)).catch(error => console.error(error));

输出:

Error

解释:

  1. promise1立即返回结果1。

  2. promise2 在200 毫秒超时后解决。

  3. promise3 在 100 毫秒超时后被拒绝,并给出原因 ‘Error’。

Promise.all()方法采用 Promise 数组作为参数,并返回一个新的 Promise,当可迭代参数中的所有 Promise 都已实现时,Promise 将通过已实现值的数组来实现。如果数组中的任何一个 Promise 被拒绝,则最终的 Promise 也会被拒绝,并给出第一个被拒绝的 Promise 的原因。

由于 Promise ( promise3) 之一被拒绝,因此 Promise.all() 被拒绝,并且 catch 块被执行。因此,代码的输出将是 Error。

问题11

Promise.resolve(1).then(value => {console.log(value);return Promise.resolve(2);}).then(value => console.log(value));

输出:

1
2

解释:

  1. Promise.resolve(1)创建一个立即处理的 Promise 1。

  2. 第一个 .then() 块将解析值记录 1 到控制台并返回一个新的 Promise ( Promise.resolve(2))。

  3. 第二个 .then() 块将解析值记录2到控制台。

结论

总之,掌握 Promise 对于熟练的异步编程至关重要。了解 Promise 链、执行顺序以及诸如 Promise.all 和 Promise.race 之类的细微差别至关重要。通过有效的 catch 错误处理确保代码的健壮性。async/await 的出现简化了异步代码,提供了更加同步的格式。

未处理的Promise reject可能会导致警告或错误,这强调了正确的错误管理的重要性。可以精确地编排异步操作,使开发人员能够创建高效且响应迅速的应用程序。

相关文章:

令人疑惑的Promise相关问题

令人疑惑的Promise相关问题 问题1 const promise new Promise((resolve, reject) > {reject(Error(Error occurred)); });promise.catch(error > console.log(error.message)); promise.catch(error > console.log(error.message));输出: Error occurr…...

Spring 多数据源搭建

目录 前言 正文 1.Druid 介绍和使用 2.其他多数据源解决方案 总结 前言 对于复杂的业务和项目,可能在一个单体项目中存在需要连接多个数据库的情况。这时,就会使用到多数据源,实际中遇到的可能性比较大。 正文 如果一个项目中需要连…...

【二分查找】LeetCode1970:你能穿过矩阵的最后一天

本文涉及的基础知识点 二分查找算法合集 作者推荐 动态规划LeetCode2552:优化了6版的1324模式 题目 给你一个下标从 1 开始的二进制矩阵,其中 0 表示陆地,1 表示水域。同时给你 row 和 col 分别表示矩阵中行和列的数目。 一开始在第 0 …...

利用python连接MySQL数据库并执行相关sql操作

一、新建MySQL数据库 1.启动MySQL服务 打开phpstudy,开启MySQL服务。如果开启失败的话,可以打开任务管理器,把正在运行的mysqld服务的进程进行关闭,再次打开MySQL服务即可启动。 2.新建MySQL数据库 选择数据库,点击…...

jenkins配置

branch: "dev" 切换分支 $WORKSPACE: /var/lib/jenkins/workspace/jenkins任务名 dest_passwd服务器密码 变量 sudo sshpass -p $dest_passwd ssh root192.168.211.319 -tt rm -rf /data/patent/*:删除文件/data/patent/* sudo sshpa…...

LeNet对MNIST 数据集中的图像进行分类--keras实现

我们将训练一个卷积神经网络来对 MNIST 数据库中的图像进行分类,可以与前面所提到的CNN实现对比CNN对 MNIST 数据库中的图像进行分类-CSDN博客 加载 MNIST 数据库 MNIST 是机器学习领域最著名的数据集之一。 它有 70,000 张手写数字图像 - 下载非常简单 - 图像尺…...

Django的回顾的第4天

1.模型层 1.1简介 你可能已经注意到我们在例子视图中返回文本的方式有点特别。 也就是说&#xff0c;HTML被直接硬编码在 Python代码之中。 def current_datetime(request):now datetime.datetime.now()html "<html><body>It is now %s.</body><…...

点云从入门到精通技术详解100篇-基于三维点云的工件曲面轮廓检测与机器人打磨轨迹规划(中)

目录 2.2.2 散乱点云滤波去噪 2.2.3 海量点云数据压缩 2.3 点云采集与预处理实验...

Mapper文件夹在resource目录下但是网页报错找不到productMapper.xml文件的解决

报错如下&#xff1a; 我的Mapper文件夹在resourse目录下但是网页报错找不到productMapper.xml。 结构如下&#xff1a;代码如下&#xff1a;<mappers><mapper resource"com/dhu/mapper/productMapper.xml" /> </mappers> 这段代码是在mybatis-co…...

22.Oracle中的临时表空间

Oracle中的临时表空间 一、临时表空间概述1、什么是临时表空间2、临时表空间的作用 二、临时表空间相关语法三、具体使用案例1、具体使用场景示例2、具体使用场景代码示例 点击此处跳转下一节&#xff1a;23.Oracle11g的UNDO表空间点击此处跳转上一节&#xff1a;21.Oracle的程…...

附录A 指令集基本原理

1. 引言 本书主要关注指令集体系结构4个主题&#xff1a; 1. 提出对指令集进行分类的方法&#xff0c;并对各种方法的优缺点进行定性评估&#xff1b; 2. 提出并分析一些在很大程度上独立于特定指令集的指令集评估数据。 3. 讨论语言与编译器议题以及…...

Unittest单元测试之unittest用例执行顺序

unittest用例执行顺序 当在一个测试类或多个测试模块下&#xff0c;用例数量较多时&#xff0c;unittest在执行用例 &#xff08;test_xxx&#xff09;时&#xff0c;并不是按从上到下的顺序执行&#xff0c;有特定的顺序。 unittest框架默认根据ACSII码的顺序加载测试用例&a…...

海云安谢朝海:开发安全领域大模型新实践 人工智能助力高效安全左移

2023年11月29日&#xff0c;2023中国&#xff08;深圳&#xff09;金融科技大会成功举行&#xff0c;该会议是深圳连续举办的第七届金融科技主题年度会议&#xff0c;也是2023深圳国际金融科技节重要活动之一。做好金融工作&#xff0c;需要兼顾创新与安全&#xff0c;当智能体…...

Postman接口测试工具完整教程

前言 作为软件开发过程中一个非常重要的环节&#xff0c;软件测试越来越成为软件开发商和用户关注的焦点。完善的测试是软件质量的保证&#xff0c;因此软件测试就成了一项重要而艰巨的工作。要做好这项工作当然也绝非易事。 第一部分&#xff1a;基础篇 postman:4.5.1 1.安…...

Android 滑动按钮(开关) SwitchCompat 自定义风格

原生的SwitchCompat控件如下图&#xff0c;不说不堪入目&#xff0c;也算是不敢恭维了。开个玩笑... 所以我们就需要对SwitchCompat进行自定义风格&#xff0c;效果如下图 代码如下 <androidx.appcompat.widget.SwitchCompatandroid:id"id/switch_compat"android:…...

前端面试灵魂提问-计网(2)

1、websocket 为什么全双工? 1.1 WebSocket是什么 WebSocket 是一种通信协议&#xff0c;它在客户端和服务器之间建立持久的全双工连接。全双工意味着数据可以双向流动&#xff0c;即客户端可以向服务器发送消息&#xff0c;服务器也可以向客户端发送消息&#xff0c;而无需…...

Git修改远程仓库名称

1、先直接在远程点仓库名&#xff0c;然后左侧菜单栏找settings-general&#xff0c;然后直接修改工程名&#xff0c;保存即可。 2、还是在settings-general下&#xff0c;下拉找到Advanced点击Expand展开&#xff0c;然后下拉到最底部 在Change path里填入新的项目名称&#x…...

kafka 集群 ZooKeeper 模式搭建

Apache Kafka是一个开源分布式事件流平台&#xff0c;被数千家公司用于高性能数据管道、流分析、数据集成和关键任务应用程序 Kafka 官网&#xff1a;Apache Kafka 关于ZooKeeper的弃用 根据 Kafka官网信息&#xff0c;随着Apache Kafka 3.5版本的发布&#xff0c;Zookeeper现…...

【LeetCode】 160. 相交链表

相交链表 题目题解 题目 给你两个单链表的头节点 headA 和 headB &#xff0c;请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点&#xff0c;返回 null 。 图示两个链表在节点 c1 开始相交&#xff1a; 题目数据 保证 整个链式结构中不存在环。 注意&am…...

TZOJ 1429 小明A+B

答案&#xff1a; #include <stdio.h> int main() {int T0, A0, B0, sum0;scanf("%d", &T); //输入测试数据的组数while (T--) //循环T次{scanf("%d %d", &A, &B); //输入AB的值sum A B;if (sum > 100) //如果是三位数{…...

SpringBoot+Redis实现高并发短信登录:双拦截器设计背后的架构思考

SpringBootRedis高并发短信登录架构深度解析&#xff1a;双拦截器设计与性能优化实战 1. 高并发场景下的登录架构挑战 在当今互联网应用中&#xff0c;短信验证码登录已成为主流的身份验证方式之一。但当系统面临高并发请求时&#xff0c;传统的Session-based方案会暴露出诸多瓶…...

OpCore-Simplify:让OpenCore EFI配置变得智能高效

OpCore-Simplify&#xff1a;让OpenCore EFI配置变得智能高效 【免费下载链接】OpCore-Simplify A tool designed to simplify the creation of OpenCore EFI 项目地址: https://gitcode.com/GitHub_Trending/op/OpCore-Simplify 问题引入&#xff1a;为什么Hackintosh配…...

FeignClient调用接口参数为null?可能是这个阿里规范在作怪

FeignClient参数丢失陷阱&#xff1a;从布尔类型序列化到企业级解决方案 微服务架构下&#xff0c;FeignClient作为声明式HTTP客户端&#xff0c;其简洁的API设计让远程调用如同本地方法般自然。但当你的DTO对象中那个精心设计的isActive字段在服务端始终显示为null时&#xff…...

Python 3.14 JIT编译延迟高达83ms?这不是Bug,是设计——揭秘AST→LLVM IR→Native Code三级缓存失效链

第一章&#xff1a;Python 3.14 JIT编译器性能调优架构设计图Python 3.14 引入的实验性 JIT 编译器&#xff08;代号 “Triton”&#xff09;采用分层编译策略&#xff0c;将热点函数动态划分为解释执行、字节码优化、LLVM IR 生成与本地机器码缓存四个协同层级。其核心设计目标…...

RTX3070 + CUDA 11.0 实战:手把手教你从零搭建 PointNet.pytorch 环境(附常见报错解决)

RTX3070 CUDA 11.0 实战&#xff1a;手把手教你从零搭建 PointNet.pytorch 环境&#xff08;附常见报错解决&#xff09; 当你手握一块RTX3070显卡&#xff0c;想要复现PointNet这一经典点云处理网络时&#xff0c;是否曾被环境配置的各种坑绊住脚步&#xff1f;本文将带你避开…...

cv2.findContours()错误的解决办法ValueError: not enough values to unpack (expected 3, got 2)

方法一&#xff1a;直接去掉一个返回值就即可。 方法二&#xff1a;把OpenCV 安装3.X的版本 具体原因 2、解析差异&#xff1a; OpenCV2和OpenCV4中&#xff1a; findContours这个轮廓提取函数会返回两个值&#xff1a;①轮廓的点集(contours)②各层轮廓的索引(hierarchy) 返回…...

救命!电路板维修高频故障排查口诀,背会秒上手,修板快准稳

修板半天没头绪&#xff1f;工控伺服板一修就慌&#xff1f;测遍元件还烧板&#xff1f;其实电路板故障排查不用死磕&#xff0c;一套好记的速记口诀&#xff0c;能帮你少走弯路、少赔成本&#xff0c;新手能快速上手&#xff0c;老手直接拉高效率&#xff0c;刷到这篇干货&…...

springboot+vue基于web的校园电动车短租系统的设计系统

目录同行可拿货,招校园代理 ,本人源头供货商系统功能分析用户管理模块车辆管理模块租赁业务模块安全与风控模块统计与报表模块技术实现要点项目技术支持源码获取详细视频演示 &#xff1a;文章底部获取博主联系方式&#xff01;同行可合作同行可拿货,招校园代理 ,本人源头供货商…...

终极指南:如何彻底解决Colab运行text-generation-webui的Matplotlib后端错误

终极指南&#xff1a;如何彻底解决Colab运行text-generation-webui的Matplotlib后端错误 【免费下载链接】text-generation-webui The original local LLM interface. Text, vision, tool-calling, training, and more. 100% offline. 项目地址: https://gitcode.com/GitHub_…...

避开原子操作坑!Keil AC5移植LwRB 3.0.0的保姆级避坑指南

避开原子操作坑&#xff01;Keil AC5移植LwRB 3.0.0的保姆级避坑指南 在嵌入式开发中&#xff0c;环形缓冲区&#xff08;Ring Buffer&#xff09;是一种常见的数据结构&#xff0c;广泛应用于串口通信、DMA传输等场景。LwRB&#xff08;Lightweight Ring Buffer&#xff09;作…...