AJAX-综合

news2024/11/19 2:32:47

文章目录

    • 同步代码和异步代码
    • 回调函数地狱
    • 解决回调函数地狱
      • Promise-链式调用
      • async函数和await
      • async函数和await-捕获错误
    • 事件循环
    • 宏任务与微任务
    • Promise.all静态方法


同步代码和异步代码

  • 同步代码:逐步执行,需原地等待结果后,才继续向下执行
  • 异步代码:调用后耗时,不阻塞代码继续执行(不必原地等待),在将来完成后触发一个回调函数

在这里插入图片描述

回调函数地狱

概念:在回调函数中嵌套回调函数,一直嵌套下去就形成了回调函数地狱
缺点:可读性差,异常无法捕捉,耦合性严重,牵一发而动全身

解决回调函数地狱

Promise-链式调用

概念:依靠then()方法会返回一个新生成的Promise对象特性,继续串联下一环任务,直到结束
细节:then()回调函数中的返回值,会影响新生成的Promise对象最终状态和结果
好处:通过链式调用,解决回调函数嵌套问题
在这里插入图片描述

async函数和await

async函数是AsyncFunction构造函数的实例,并且允许使用await关键字。aysnc和await关键字让我们用一种更简洁的方式写出基于Promise的异步代码,而无需刻意地链式调用Promise。
概念:在async函数内,使用await关键字取代then函数,等待获取Promise对象成功状态的结果值

async函数和await-捕获错误

使用:try...catch
标记要尝试的语句块,并指定一个出现异常时抛出的响应。
语法:

try {
	// 要执行的代码
} catch (error) {
	// error接收的是错误信息
	// try里代码,如果有错误,直接进入这里执行
}

事件循环

概念:JavaScript有一个基于事件循环的并发模型,事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。
原因:JavaScript单线程,为了让耗时代码不阻塞其他代码运行,设计了事件循环模型
定义:执行代码和收集异步任务的模型,在调用栈空闲,反复调用任务队列里回调函数的执行任务,就叫事件循环。
执行过程:

  • 执行异步代码,遇到异步代码交给宿主浏览器环境执行
  • 异步拥有结果后,把回调函数放入任务队列排队
  • 当调用栈空闲后,反复调用任务队列里的回调函数

宏任务与微任务

异步任务分为:

  • 宏任务:由浏览器环境执行的异步代码
  • 微任务:由JavaScript引擎环境执行的异步代码
任务(代码)执行所在环境
JavaScript脚本执行事件(script)浏览器
setTimeout/setInterval浏览器
AJAX请求完成事件浏览器
用户交互事件浏览器
Promise对象.then()JavaScript引擎

注意:Promise本身是同步的,而then和catch回调函数是异步的
执行过程:

  • 执行第一个script脚本事件宏代码,里面同步代码
  • 遇到宏任务/微任务交给宿主环境,有结果回调函数进入对应队列
  • 当执行栈空闲时,清空微任务队列,再执行下一个宏任务,从1再来

在这里插入图片描述

Promise.all静态方法

概念:合并多个Promise对象,等待所有同时成功完成(或某个失败),做后续逻辑
在这里插入图片描述
语法:

const p = Promise.all([Promise对象,Promise对象,...])
p.then(result => {
	// result结果:[Promise对象成功结果,Promise对象成功结果,...]
}).catch(error =>{
	// 第一个失败的Promise对象抛出的异常
})

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

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

相关文章

LLM漫谈(五)| 从q star视角解密OpenAI 2027年实现AGI计划

最近,网上疯传OpenAI2027年关于AGI的计划。在本文,我们将针对部分细节以第一人称进行分享。​ 摘要:OpenAI于2022年8月开始训练一个125万亿参数的多模态模型。第一个阶段是Arrakis,也叫Q*,该模型于2023年12月完成训练&…

微软Microsoft Surface Go 2

1个小玩具 Microsoft Surface Go 2的评测结果出炉!它是目前最好的中端Windows 二合一笔记本平板。 外形简洁小巧,工作娱乐两不误。 它有多个版本。 我们测试的是配备8GB Ram和128GB SSD的Pentium 4425Y处理器(第8代)的型号。 S…

力扣242. 有效的字母异位词

思路:字母相互抵消的思路,本题字符串中只包含小写字母26位,那就新建record数组int[26],下标0-25,代表小写字母a-z, 需要通过 某字符减a 来达到这一目的; class Solution {public boolean isAnagram(String…

Oracle 使用OGG(Oracle GoldenGate) 实现19c PDB与MySQL5.7 数据同步

OGG 是一种基于日志的结构化数据复制软件,它通过解析源数据库在线日志或归档日志获得数据的增删改变化。 OracleMysqlIP address192.168.80.100192.168.80.16DB version19.2.05.7host nametempmysql OS version: CentOS 7.9 一,Oracle 服务…

[数据结构]二叉树(下)

一、二叉树的节点和深度关系 1.满二叉树 我们可以假设二叉树有N个节点,深度为h我们可以恒容易得到满二叉树每行的节点数,然后错位相减,算出节点与高度的关系。 2.完全二叉树 注意我这个是因为最后一行的节点数为1。 二、向上调整建堆和向下调整建堆的时…

NFT交易市场-后端开发

首先我们需要配置好我们的ipfs,参考官方文档 1.https://docs.ipfs.tech/install/command-line/#system-requirementshttps://docs.ipfs.tech/how-to/command-line-quick-start/#initialize-the-repository 首先新建一个文件夹 然后在终端输入npm init -y命令进行初…

【数据结构】顺序表习题之移除元素和合并两个有效数组

👑个人主页:啊Q闻 🎇收录专栏:《数据结构》 🎉道阻且长,行则将至 前言 嗨呀,今天的博客是关于顺序表的两道题目,是力扣的移除元素和合并有序数组的题目。 一.移除…

java selenium 元素点击不了

最近做了一个页面爬取,很有意思被机缘巧合下解决了。 这个元素很奇怪,用xpath可以定位元素,但是就是click()不了。 试过了网上搜的一些办法: //尝试一 WebElement a_tag driver.findElement(By.xpath("xxx")); a_tag…

今天聊聊新零售

一、什么是新零售? 2016年,在杭州举行的“云栖大会”上,马云发表了讲话,首次提出了“新零售”这一概念。 1.1 新零售概念 新零售,英文是New Retailing,新零售是对人货场的重构。人是消费者、销售人员、…

Linux:Jenkins全自动持续集成持续部署(3)

在上一章部署好了之后,还需要点击一下才能进行部署,本章的效果是:当gitlab上的代码发生了变化后,我们不需要做任何事情不需要去点击构建按钮,Jenkins直接自动检测变化,然后自动去集成部署Linux:…

jmeter参数化--CSV数据驱动

主要是用来接口测试正例反例测试。 http请求下添加csv数据文件设置 进行csv配置 1、首先创建csv文件 内容第一行输入变量名,逗号隔开 下面输入正常异常的测试值及对应的校验结果。 2、CSV数据文件配置 文件名路径选择上面创建的csv文件 编码选utf-8 变量名与csv…

【深度学习】四种天气分类 模版函数 从0到1手敲版本

引入该引入的库 import torch import torch.nn as nn import matplotlib.pyplot as plt import torch.nn.functional as F import torchvision import torch.optim as optim %matplotlib inline import os import shutil import glob os.environ["KMP_DUPLICATE_LIB_OK&q…

【数据挖掘】实验5:数据预处理(1)

实验5:数据预处理(1) 一:实验目的与要求 1:熟悉和掌握数据预处理,学习数据清洗、数据集成、数据变换、数据规约、R语言中主要数据预处理函数。 二:实验内容 【缺失值分析】 第一步&#xff1…

Python工具-清理Unity(批量深度)清理U3D项目工程保留关键工程文件

前沿 1. Unity工程越来越多,很久不用的工程里存在了很多无用的大文件夹,极大的影响电脑容量。 2. 我电脑里面U3D工程只有17个,但容量就高达60GB,使用自己编写的工具清理后,减到了30GB多。清理了不是很重要的文件和文件…

2024-03-22 问AI: 介绍一下深度学习中的 sigmoid函数

文心一言 Sigmoid函数是深度学习中常用的一种激活函数,主要用于将神经元的输出值压缩到0和1之间。这种特性使得sigmoid函数在二分类问题中特别有用,因为输出值可以被解释为属于某个类别的概率。 sigmoid函数的数学表达式为: σ(x) 1 / (1…

Notepad++ 如何调整显示字面大小

在 Notepad 上,可以使用 ctrl 加上鼠标的左键来滚动来进行调整。 如何恢复默 可以使用 Ctrl 加数字键盘上的 / 键 来恢复默认设置。 当然也可以通过菜单栏上 view 菜单下的 Zoom 选项。 上面的界面中可以看到我们的在 Notepad 中使用的选项。 Notepad 如何调整显示…

llvm后端

SelectionDAGBuilder是LLVM(Low Level Virtual Machine)编译器中的一个重要组件,它负责将LLVM中间表示(Intermediate Representation,IR)转换为SelectionDAG(选择有向无环图)的形式。…

RabbitMq高可用

消息队列高级 服务异步通信-高级篇1.消息可靠性1.1.生产者消息确认1.2.消息持久化1.3.消费者消息确认1.4.消费失败重试机制1.5.总结 2.死信交换机2.1.初识死信交换机2.2.TTL2.3.延迟队列 3.惰性队列3.1.消息堆积问题3.2.惰性队列 4.MQ集群4.1.集群分类4.2.普通集群4.3.镜像集群…

C#,图论与图算法,计算图(Graph)的岛(Island)数量的算法与源程序

1 孤岛数 给定一个布尔矩阵,求孤岛数。一组相连的1形成一个岛。例如,下面的矩阵包含5个岛: 在讨论问题之前,让我们先了解什么是连接组件。无向图的连通分量是一个子图,其中每两个顶点通过一条路径相互连接,并且不与子图外的其他顶点连接。 所有顶点相互连接的图只有一个…

Spring05 SpringIOC DI

名词解释 今天我们来介绍Spring框架的最重要的part之一 SpringIOC 和 DI 这里的SpringIOC 其实是容器的意思,Spring是一个包含了很多工具方法的IOC容器 什么是IOC呢? IOC其实是Spring的核心思想 Inversion of Control (控制反转) 可能这里你还是不理解这个是啥意思 其实就…