Promise学习之同步与异步

目录

前言

一、同步与异步

(一) 同步

(二) 异步

二、总结

(一) 同步

(二) 异步


前言

Java有多线程,前端有同步与异步,异步操作可以优化用户体验提高性能与响应处理并发与并行任务等等,异步操作有发送Ajax请求读文件等,当然异步操作也会带来一些问题回调地狱,那竟然有问题的产生,也就会有解决问题的方法Promise。本系列文章是关于Promise的学习,希望能够帮助大家,如有问题也就大家指出。

感谢李立超老师的讲课,理论清晰透彻,十分推荐!!!观看链接

一、同步与异步

(一) 同步

在计算机程序中,我们所编写的代码一般都是从上到下执行,上一行代码执行完了才会接着到下一行代码的执行,这也就是我们所说的同步

例子

  • 比如去餐厅吃饭,是要点餐等餐吃饭付钱离开,这些步骤都是按照顺序执行的

代码演示

console.log("1.点餐");
const current = Date.now();
console.log("2.等餐");
console.log("等餐2秒钟...");
while (Date.now() - current < 2000) {}
console.log("3.吃饭");
console.log("4.付钱");
console.log("5.离开");

(二) 异步

同步执行中一段代码执行完才会轮到下一段代码,那如果上一段代码一直执行,那下一段代码就需要一直等待,如果映射到项目中就会导致页面白屏系统无法正常操作造成用户体验不佳等问题,这时候就需要异步

例子:

  • 发送ajax请求,在请求过程中,我们可以先避开请求所需时间,继续往下,等请求响应了在进行请求的操作(拿数据、根据响应操作等等)
  • 在等餐过程中,我们做了其他事情,比如玩手机唱跳rap,去做这些事情不会去影响接下来的流程,还可以帮助我们做更多的事情

代码演示一

console.log("页面挂载");
const current = Date.now();
setTimeout(() => {console.log("发送ajax请求");console.log("等待ajax请求响应...");console.log("ajax响应完成,根据响应获取数据");}, 2000);
console.log("页面挂载完成");
console.log("用户浏览网站");

代码演示二

编写两个数的求和异步函数,然后基于请求函数的结果进行下一个请求,以此类推,而异步代码无法通过return设置返回值,需要通过回调函数去获取结果

function sum(a, b, cb) {setTimeout(() => {cb(a + b);}, 2000);
}
const result = sum(10, 20, (result) => {console.log("执行结果1", result);sum(result, 30, () => {console.log("执行结果2", result);sum(result, 40, () => {console.log("执行结果3", result);sum(result, 50, () => {console.log("执行结果4", result);sum(result, 60, () => {console.log("执行结果5", result);console.log("执行结束");});});});});
});

异步代码通过回调函数去获取结果,如果想基于结果再进行下一步计算,就需要在回调函数里面继续调用异步求和函数,这也导致了我们的代码一层嵌套一套,代码极其不美观、可读性差,这也就是我们所说的回调地狱

二、总结

(一) 同步

概念

代码按照从上到下的顺序执行,只有上一段代码执行完才会继续执行下一段代码

特点

代码从上往下执行,顺序分明

问题

  • 前面的代码不执行,后面的代码也不会执行
  • 同步代码执行会出现阻塞的情况
  • 一段代码的执行慢回影响到整个程序

(二) 异步

概念

异步执行代码,后面的代码无需等待异步代码执行完才能执行

特点

  • 不会阻塞其他代码的执行
  • 需要通过回调函数来返回结果

问题

  • 代码可读性差
  • 可调试性差

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

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

相关文章

MATLAB水果分级系统

课题介绍 现在商业行为中&#xff0c;在水果出厂前都需要进行质量检测&#xff0c;需要将不同等级的水果进行分级包装&#xff0c;以保证商业利益最大化。可是传统方法都是依靠人工进行检测&#xff0c;效率低下&#xff0c;主观成分大&#xff0c;并不能很好客观地评价出货质…

可集成多模型的机器人开发框架 dora:让机器人编程走向大众

作者 | Annie Xu 责编 | 何苗 出品 | GOSIM 开源创新汇 C 和 C是机器人编程中常用的编程语言&#xff0c;但学起来存在一定难度。那些对机器人感兴趣&#xff0c;但没有精力花费数周时间学习 C 和 C编程的用户只能望而却步。 为了让机器人技术变得更简单&#xff0c;陶海轩&a…

SQL手工注入漏洞测试(MongoDB数据库)

此次靶场地址为&#xff1a;墨者学院 ⼀. 如下给出的源码...可以看到数据库查询的语句如下..构造回显测试... new_list.php?id1});return ({title:1,content:2 ⼆.成功显示“ 1” 和“ 2” 。可以在此来显示想要查询的数据。接下来开始尝试构造payload查询 当前数据库。通过…

C# 中 ScrapySharp 的多线程下载策略

引言 在现代互联网应用中&#xff0c;数据抓取是一个常见的需求&#xff0c;无论是为了数据分析、内容聚合还是自动化测试。ScrapySharp 是一个基于 .NET 的轻量级、高性能的网页抓取库&#xff0c;它提供了丰富的功能来简化网页内容的抓取和处理。然而&#xff0c;当面对大量…

使用python实现3D聚类图

实验记录&#xff0c;在做XX得分预测的实验中&#xff0c;做了一个基于Python的3D聚类图&#xff0c;水平有限&#xff0c;仅供参考。 一、以实现三个类别聚类为例 代码&#xff1a; import pandas as pd import numpy as np from sklearn.decomposition import PCA from sk…

静力水准仪的基本工作原理:解析磁致伸缩式水准仪

静力水准仪作为一种高精度的测量设备&#xff0c;广泛应用于桥梁、隧道、地铁、大坝、大型储罐等工程结构的沉降监测中。其中&#xff0c;磁致伸缩式静力水准仪以其独特的测量原理和技术优势&#xff0c;成为沉降监测领域的重要工具。本文将详细解析磁致伸缩式静力水准仪的基本…

67 H3C SecPath F1000 (网络大致介绍)

一 VRF VRF&#xff08;Virtual Routing and Forwarding&#xff0c;虚拟路由和转发&#xff09;用来实现不同VPN的路由隔离。每个VRF都有相对独立的路由表和LFIB&#xff08;Label Forwarding Information Base&#xff0c;标签转发信息库&#xff09;&#xff0c;确保VPN数据…

MySQL基础:事务

&#x1f48e;所属专栏&#xff1a;MySQL &#x1f48e;1. 事务 事务是一组操作的集合&#xff0c;它是一个不可分割的工作单位&#xff0c;事务会把所有的操作作为一个整体一起向系统提交或撤销操作请求&#xff0c;这些操作要么同时成功&#xff0c;要么同时失败 例如转账…

C++第四十弹---从零开始:模拟实现C++中的unordered_set与unordered_map

✨个人主页&#xff1a; 熬夜学编程的小林 &#x1f497;系列专栏&#xff1a; 【C语言详解】 【数据结构详解】【C详解】 目录 1 哈希概念 2 哈希冲突 3 哈希函数 4 哈希冲突解决 4.1 闭散列 4.1.1. 线性探测 4.1.2. 二次探测 4.2 开散列 4.2.1. 开散列概念 4.2.2…

C语言一笔画迷宫

目录 开头程序程序的流程图程序游玩的效果结尾 开头 大家好&#xff0c;我叫这是我58。 程序 #define _CRT_SECURE_NO_WARNINGS 1 #include <stdio.h> #include <string.h> #include <Windows.h> void printmaze(const char strmaze[11][11]) {int ia 0;…

智慧环卫与智慧城市:以人文本的创新发展之路

智慧环卫与智慧城市&#xff1a;以人文本的创新发展之路 前言智慧环卫与智慧城市 前言 智慧环卫和智慧城市的建设是当今社会发展的重要趋势&#xff0c;它们对于提升城市管理水平、改善居民生活质量具有至关重要的意义。随着国家政策对新型城市建设的大力推动&#xff0c;智慧…

Android13 app后台无法启动Abort background activity starts from

总纲 android13 rom 开发总纲说明 目录 1.前言 2.log分析 3.代码查找分析 4.修改方法 5.编译测试 6彩蛋 1.前言 Android13 用户app后台无法启动,提示Abort background activity starts from 10111 2.log分析 08-07 21:37:36.703: W/ActivityTaskManager(440): Back…

保护网站安全,了解常见的几种网络攻击

随着互联网技术的迅猛发展&#xff0c;网站作为信息展示和交互的重要平台&#xff0c;面临着日益复杂的网络攻击威胁。从简单的口令入侵到复杂的分布式拒绝服务&#xff08;DDoS&#xff09;攻击&#xff0c;网络攻击手段层出不穷&#xff0c;给网站所有者带来了巨大的挑战。今…

完成控制器方法获取参数-@RequestParam

文章目录 1.将方法的request和response参数封装到参数数组1.SunDispatcherServlet.java1.根据方法信息&#xff0c;返回实参列表2.具体调用 2.测试 2.封装Http请求参数到参数数组1.自定义RequestParam注解2.MonsterController.java 增加参数3.SunDispatcherServlet.java1.resol…

正则表达式备查

一、常用 符号内容\将下一字符标记为特殊字符、文本、反向引用或八进制转义符。例如&#xff0c;“n”匹配字符“n”。“\n”匹配换行符。序列“\”匹配“\”&#xff0c;“(”匹配“(”。^匹配输入字符串开始的位置。如果设置了 RegExp 对象的 Multiline 属性&#xff0c;^ 还…

ARM工作模式

ARM ARM架构ARM七个工作模式寄存器异常向量表存储格式&#xff08;内存大小端&#xff09;汇编指令 ARM架构 RAM&#xff1a;随机访问存储器 ROM&#xff1a;只读访问存储器 AHB&#xff1a;先进高速总线 APB&#xff1a;先进外设总线 USB&#xff1a;统一串行总线 norflash&am…

基于Vue.js+Express的夕阳红养老院管理系统的设计与实现--附源码98650

目 录 摘要 1 绪论 1.1 研究背景 1.2 研究意义 1.3论文结构与章节安排 2 相关技术介绍 2.1 Express框架介绍 2.2 Vue.js 2.3 MySQL数据库 2.4 Node.js主要功能 3系统分析 3.1 可行性分析 3.2 系统流程分析 3.2.1 数据新增流程 3.2.2 数据修改流程 3.2.3数据删除…

AWS SAM CLI 备忘单!

安装 AWS SAM CLI brew tap aws/tap brew 安装 aws-sam-cli 验证安装 $ sam --version 升级 SAM $ brew upgrade aws-sam-cli 您需要 AWS 凭证才能在 AWS 上工作。 构建并部署简单应用程序 $ sam init→ 下载示例应用程序 $ sam build→ 构建您的应用程序 $ sam deploy --guid…

Java学习_18_Stream流

文章目录 前言一、不可变集合二、Stream流思想第一步&#xff1a;得到Stream流第二步&#xff1a;Stream流的中间方法Stream流的终结方法 总结 前言 博客仅记录个人学习进度和一些查缺补漏。 学习内容&#xff1a;BV17F411T7Ao 一、不可变集合 不可变集合就是长度和内容都不可…

希尔排序,详细解析(附图解)

1.希尔排序思路 希尔排序是一种基于插入排序的算法&#xff0c;通过将原始数据分成若干个子序列&#xff0c;然后对子序列进行插入排序&#xff0c;逐渐减小子序列的间隔&#xff0c;最后对整个序列进行一次插入排序。 1.分组直接插入排序&#xff0c;目标接近有序--------…