浅谈同步、异步、回调函数之间的关系?

简介: 同步:发出一个调用时,在没有得到结果之前,该调用就不返回;一旦调用返回,就得到返回值。换句话说,就是由调用者主动等待这个调用的结果。
关于这个问题其实我以前没有想过,但就是在最近,我踩坑了,我才明白了这些东西,接下来我就来给大家简单的谈一下。

首先,先来简单介绍一下同步、异步以及回调函数的概念,以此来帮助大家快速的理解问题

  • 同步:发出一个调用时,在没有得到结果之前,该调用就不返回;一旦调用返回,就得到返回值。换句话说,就是由调用者主动等待这个调用的结果。
  • 异步:调用在发出之后,这个调用就直接返回了,所以没有返回结果。当一个异步过程调用发出后,调用者不会立刻得到结果。而是在调用发出后,被调用者通过状态、通知或通过回调函数,让调用者能响应结果。
  • 回调函数:主函数通过参数将函数传递到其它代码的,某一块可执行代码的引用。简单点来说就是,一个函数执行完成之后的返回数据,通过参数的形式传递给主函数。

然后进入主菜,说下我当时遇到的问题。

问题描述

js 中有一前一后两个语句,第一个是加载控件,就是显示加载中这个样式动画;第二个是一个异步方法,回调函数中存在一个 alert 弹窗。当我执行的时候,发现了一个问题,就是加载动画总是延迟几秒等待异步方法调用完成才显示加载动画和弹出 alert 弹窗,几乎是同时。这肯定是不符合我的需求的,我最开始的想法就是异步去调用后台接口的时候显示加载动画提示用户等待,而不是调完完成才显示加载动画,那样也就没有了意义。
image-1663596051474

问题分析

一开始不了解到底是个怎么回事,就很迷茫,起初我以为是代码的问题,后来还是没有任何思绪,就问了别人一下,然后大佬跟我说,js 本身是单线程的,每次只能执行一个任务,我的问题就是加载动画和异步方法执行的太快了,导致加载动画那行代码虽然执行了,但是显示的时候需要跟异步回调 alert 弹窗去竞争CPU资源,正常的话是按照你用一会CPU,我用一会CPU,这就导致了最后两个控件几乎是同时显示出来的,差不多就是这个道理。

问题解决

听完之后感觉瞬间明白了很多东西,然后用了一个setTimeout()函数给异步方法延迟调用了100毫秒,这个问题马上就解决了。

但是随之而来的又出现了一个问题,因为异步函数他其实可以理解为单开一个线程去执行,它执行了之后并不会马上回调,而是等到处理完成之后把结果传给回调函数。异步调用它其实不会影响之前的代码,但是之后的代码如果有回调函数的标志字段,就比如说执行成功,回调函数去更新这个标志字段的值。但是调用异步函数后,会马上去接着向下执行代码。同步和异步都是可以有回调函数的,不过现在一般异步回调用的比较多。同步的话是会等待着这个函数执行真的结束再向下执行,所以下面的标志字段值并不会受到影响。而异步则是执行了函数之后直接向下执行,并不会等待,所以这样的话。我们放在回调中的标志字段就又可能还没有被赋值,下面判断标志字段位的代码其实就是个问题。
image-1663596136293
其实这种问题有很多解决方案,就比如说可以轮询判断标志位是否已被赋值,已被赋值就可以结束轮询,向下执行;或者就是把下面要执行的操作放在回调里面,执行完成回调里原有的操作后直接执行之后的代码,这样的话就比较方便,不用单独去搞一个轮询判断,这样问题就解决了。

问题就是这么个问题,事情就是这么个事情,又学到了新知识!
目录
相关文章
|
数据采集 调度 C语言
嵌入式系统中的定时器中断与任务调度
嵌入式系统中的定时器中断与任务调度
|
存储 自然语言处理 数据安全/隐私保护
微信公众号后台回复5s重试解决方案和思路
微信公众号后台回复5s重试解决方案和思路
1005 0
|
存储 小程序 JavaScript
|
10月前
|
人工智能 测试技术 API
Ollama本地模型部署+API接口调试超详细指南
本文介绍了如何使用Ollama工具下载并部署AI大模型(如DeepSeek-R1、Llama 3.2等)。首先,访问Ollama的官方GitHub页面下载适合系统的版本并安装。接着,在终端输入`ollama`命令验证安装是否成功。然后,通过命令如`ollama run Llama3.2`下载所需的AI模型。下载完成后,可以在控制台与AI模型进行对话,或通过快捷键`control+d`结束会话。为了更方便地与AI互动,可以安装GUI或Web界面。此外,Ollama还提供了API接口,默认支持API调用,用户可以通过Apifox等工具调试这些API。
|
缓存 Java 开发者
Java字面量详解:概念、分类与使用实例
本文介绍了Java字面量的概念、分类及应用。
543 11
|
SQL 存储 运维
从建模到运维:联犀如何完美融入时序数据库 TDengine 实现物联网数据流畅管理
本篇文章是“2024,我想和 TDengine 谈谈”征文活动的三等奖作品。文章从一个具体的业务场景出发,分析了企业在面对海量时序数据时的挑战,并提出了利用 TDengine 高效处理和存储数据的方法,帮助企业解决在数据采集、存储、分析等方面的痛点。通过这篇文章,作者不仅展示了自己对数据处理技术的理解,还进一步阐释了时序数据库在行业中的潜力与应用价值,为读者提供了很多实际的操作思路和技术选型的参考。
407 1
|
弹性计算 Serverless 数据安全/隐私保护
针对【图像生成 - ComfyUI】使用的深度评测
ComfyUI 是一款支持自定义工作流的图像生成工具,适用于创意设计、游戏开发和电商等多个行业。它能根据项目需求灵活调整图像生成流程,提高创意实现效率,同时具备成本效益和弹性伸缩能力,适应业务量变化。尽管如此,ComfyUI 在技术门槛和数据安全方面仍存在挑战,需注意非专业用户的学习曲线和敏感数据保护。
|
数据可视化 JavaScript 前端开发
低代码可视化Uniapp点击事件-代码生成器
低代码可视化Uniapp点击事件-代码生成器
367 0
低代码可视化Uniapp点击事件-代码生成器
|
消息中间件 NoSQL Kafka
go-zero微服务实战系列(九、极致优化秒杀性能)
go-zero微服务实战系列(九、极致优化秒杀性能)
|
数据安全/隐私保护
注册Github账号详细过程
注册GitHub账号前,请备妥有效电子邮件地址以接收验证信,设定独特的用户名(仅含字母、数字或单连字符,不以连字符起始或结束),并创建具有一定复杂度的密码。接着,访问GitHub官网(`https://github.com/`),点击右上角的“Sign up”进入注册页面。在此页面填写用户名、电子邮箱与密码,选择是否接收产品更新及公告,通过人机验证后提交。最后,通过注册邮箱内的验证链接完成验证,即可启用您的GitHub账号。
1694 0