回调函数与回调地狱

回调函数

把一个函数当作参数传递给另一个函数,但是此函数并不会立即执行,而是在将来特定的时机再去调用,这个函数就叫做回调函数。在定时器setTimeout以及Ajax的请求时都会用到回调函数。

在这里插入图片描述

再举个栗子:

你到一个商店去买东西,刚好你要的东西没有货,于是你在店员那里留下了你的电话,过了几天店里有货了,店员就打了你的电话,然后你接到电话后就到店里去取了货。

在这个例子里,你的电话号码就叫回调函数,你把电话留给店员就叫登记回调函数,店里后来有货了叫做触发了回调关联的事件,店员给你打电话叫做调用回调函数,你到店里去取货叫做响应回调事件。


回调函数在我们启动一个异步任务的时候就会告诉它:等你完成了这个任务之后要干什么。这样一来主线程几乎不用关心异步任务的状态了,他自己会善始善终。

// setTimeout中第一个参数就是回调函数,只有在1秒后执行setTimeout(() => {console.log('执行回调函数!!')}, 1000);console.log('先执行我捏~~')

根据前面对异步任务的介绍,应该知道此代码会先执行定时器后的语句,再执行定时器及回调函数

在这里插入图片描述

回调地狱

根据前面对异步编程以及回调函数的介绍我们可以得出一个结论:存在异步任务的代码,不能保证其按照顺序执行,那如果我们非要代码顺序执行呢?

比如我要间隔不同时间输出三句话,语序必须是下面这样的:我在定时器1里捏!!我在定时器2里捏!!我在定时器3里捏!!

    setTimeout(() => {console.log('我在定时器1里捏!!')}, 3000)setTimeout(() => {console.log('我在定时器2里捏!!')}, 2000)setTimeout(() => {console.log('我在定时器3里捏!!')}, 1000)console.log('我在定时器后捏~~')

当使用定时器顺序调用时,则会出现输出顺序错乱的问题:

在这里插入图片描述

所以必须要这样操作,才能保证输出顺序正确:

    setTimeout(() => {console.log('我在定时器1里捏!!')setTimeout(() => {console.log('我在定时器2里捏!!')setTimeout(() => {console.log('我在定时器3里捏!!')}, 1000)}, 2000)}, 3000)console.log('我在定时器后捏~~')

在这里插入图片描述

可以看到,代码中的回调函数层层嵌套,并且嵌套了3层,这种回调函数中嵌套回调函数的情况就叫做回调地狱

在这里插入图片描述

所以回调地狱就是为实现代码顺序执行而出现的一种操作,它会造成我们的代码可读性非常差,后期不好维护

那么该如何解决回调地狱问题呢?

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

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

相关文章

STM32F1 - 标准外设库_规范

STM32F10x_StdPeriph_Lib_V3.6.0 1> 头文件包含关系2> .c文件内部结构3> 宏定义位置4> 位掩码bit mask5> .c文件中定义私有变量6> 枚举类型定义 1> 头文件包含关系 1个头文件stm32f10x.h 就把整个MCU以及标准外设库,就管理了; 2>…

Linux(Ubuntu)环境下安装卸载Python3(避免踩坑)

一、安装 第一步: 进入/usr/local/目录,下载Python3,这里我下载的是python 3.8.10,如果要下载其他版本改下链接中的版本号,需与官网版本号对应。 wget https://www.python.org/ftp/python/3.8.10/Python-3.8.10.tgz第…

C++类型转化cast from pointer to smaller type ‘int‘ loses information

代码如下 #include <iostream>int main() {int a 10;std::cout << (int)&a << std::endl;return 0; }编译 这段代码是要将地址转化成整数类型&#xff0c;但是在编译时编译器告诉我们这是错的&#xff0c;因为在C中&#xff0c;将指针转换为int类型的…

Maui blazor ios 按设备类型设置是否启用safeArea

需求&#xff0c;新做了个app&#xff0c; 使用的是maui blazor技术&#xff0c;里面用了渐变背景&#xff0c;在默认启用SafeArea情况下&#xff0c;底部背景很突兀 由于现版本maui在SafeArea有点bug&#xff0c;官方教程的<ContentPage SafeAreafalse不生效&#xff0c;于…

Kubernetes实战(二十六)-K8S 部署Dashboard UI

Kubernetes Dashboard是Kubernetes集群的通用、基于Web的UI。它允许用户管理集群中运行的应用程序并对其进行故障排除&#xff0c;以及管理集群本身。 访问到DashBoard有两种方式&#xff1a; 通过KubernetesAPI访问&#xff1a;Dashboard是Kubernetes的内置的UI插件&#xff…

系统架构21 - 统一建模语言UML(下)

UML图 UML中的图分类作用 视图用例视图逻辑视图进程视图实现视图部署视图 UML中的图 “图”是一组元素的图形表示&#xff0c;大多数情况下把图画成顶点&#xff08;代表事物&#xff09;和弧&#xff08;代表关系&#xff09;的连通图。为了对系统进行可视化&#xff0c;可以…

H12-821_73

73.某台路由器Router LSA如图所示&#xff0c;下列说法中错误的是&#xff1f; A.本路由器的Router ID为10.0.12.1 B.本路由器为DR C.本路由器已建立邻接关系 D.本路由器支持外部路由引入 答案&#xff1a;B 注释&#xff1a; LSA中的链路信息Link ID&#xff0c;Data&#xf…

单片机学习笔记---蜂鸣器工作原理

目录 蜂鸣器介绍 蜂鸣器的驱动方式 ULN2003D芯片工作原理 实战预备知识&#xff1a;基础乐理 音名的分组 全音和半音的关系 音高的表示 五线谱中的符号定义 简谱上的符号定义 C调音符与频率对照表 相关计算 蜂鸣器介绍 蜂鸣器是一种将电信号转换为声音信号的器件&a…

在Ubuntu上部署Stable Video Diffusion动画制作

Stable Diffusion团队推出的开源模型Stable Video Diffusion&#xff0c;支持生成约3秒的视频&#xff0c;分辨率为5761024。通过测试视频展示了其令人瞩目的性能&#xff0c;SVD模型是一个生成图像到视频的扩散模型&#xff0c;通过对静止图像的条件化生成短视频。其特点主要包…

【初中生讲机器学习】6. 分类算法中常用的模型评价指标有哪些?here!

创建时间&#xff1a;2024-02-07 最后编辑时间&#xff1a;2024-02-09 作者&#xff1a;Geeker_LStar 你好呀~这里是 Geeker_LStar 的人工智能学习专栏&#xff0c;很高兴遇见你~ 我是 Geeker_LStar&#xff0c;一名初三学生&#xff0c;热爱计算机和数学&#xff0c;我们一起加…

leetcode 3027. 人员站位的方案数 II【离散化前缀和+枚举】

原题链接&#xff1a;3027. 人员站位的方案数 II 题目描述&#xff1a; 给你一个 n x 2 的二维数组 points &#xff0c;它表示二维平面上的一些点坐标&#xff0c;其中 points[i] [xi, yi] 。 我们定义 x 轴的正方向为 右 &#xff08;x 轴递增的方向&#xff09;&#x…

今年春节联欢晚会中的扑克魔术到底是咋变的?

今年的刘谦给全国观众带来了俩魔术&#xff0c;一个是洗牌一个是撕牌&#xff0c;前面第一个魔术看不出来太神奇了&#xff0c;但是第二魔术感觉挺有趣的我可以简单分析分析。 然后我们列出这个魔术的关键步骤&#xff1a; 打乱四张牌 1 2 3 4 对折、撕开、面向同一个方向重…