Ajax基础总结(思维导图+二维表)

一些话

刚开始学习Ajax的时候,感觉很模糊,但是好像学什么都是这样的,很正常,但是当你学习的时候要持续性敲代码,边敲代码其实就可以理解很多了。然后在最后的总结,其实做二维表之后,就可以区分好多相似的东西,做了思维导图之后就很容易把脑子里的东西串成一条线。

所以说,建议大家总结啦

思维导图

这些是总的导图

这是抽取之后的

二维表

使用axios和promise对象实现Ajax有什么区别

axios 是由 promise 封装的一个 http 的库。

回调函数地狱的情况,可以使用Promise解决

比较项目

Axios 实现 Ajax

Promise 对象实现 Ajax(原生方式)

代码复杂度

较低,因为 Axios 已经封装了很多功能,代码简洁明了

较高,需要自己处理 XMLHttpRequest 的多个细节

功能丰富度

提供自动转换数据、拦截请求 / 响应、跨域支持等高级功能

主要实现基本的请求 - 响应功能,高级功能需自己实现

跨平台性

支持浏览器和 Node.js 环境

主要用于浏览器环境,在 Node.js 中需要做一些调整

对请求细节控制

相对较少,Axios 已经处理了很多底层细节

更多,可以深入定制请求的各个环节

await,async和Promise

下面一些图片我忘了从哪找到的了,如果有知道的欢迎在评论区说明

我的二维表

比较项目

async和await

Promise

定义

async用于声明异步函数,返回Promise对象;await只能async函数内使用,暂停函数执行直到Promise状态改变

表示尚未完成(或可能已完成)的异步操作的对象,有三种状态,表示异步操作最终的完成(或失败)以及其结果值

错误处理

在async函数中用try/catch块捕获await表达式中的错误

通过catch方法捕获Promise被reject后的错误

代码风格

让异步代码看起来更像同步代码,对于复杂异步流程(如多个异步操作顺序执行和错误处理)结构更清晰,减少嵌套

链式调用(then、catch等)可处理多个异步操作顺序和结果,但过多链式调用可能导致代码嵌套深、可读性差

相互关系

async函数返回Promise,await用于暂停async函数内部执行等待Promise状态改变,是基于Promise的语法糖

async和await基于Promise构建,用于更方便地处理Promise

get和post的区别

get

post

请求的目的

通常用于从服务器检索(获取)数据。它不会修改服务器上的数据。

通常用于向服务器发送数据(如提交表单)。它可能会导致服务器上的数据被修改。

安全性

GET 方法的参数会暴露在 URL 中

而 POST 方法的参数则放在请求体中,相对安全一些。

参数长度限制

GET 方法的参数长度有限制,对于只传输少量数据的请求比较适用

POST 方法没有参数长度限制,适合传输大量数据。

请求的数据

请求的数据(如果有的话)会附加到URL的查询字符串中,并以键值对的形式出现(例如,?key1=value1&key2=value2)。这意味着GET请求的数据长度是有限制的(由浏览器和服务器共同决定,但通常较短),且不适合传输敏感信息(因为URL可能会记录在浏览器历史、服务器日志等地方)。

请求的数据会放在请求体中发送,这意味着它可以传输大量数据,且不会受到URL长度的限制。POST请求更适合传输敏感信息,因为请求体通常不会在浏览器历史或服务器日志中记录。

缓存

GET 方法的请求会被浏览器缓存,多次请求相同的 URL 时,有可能直接读取缓存中的结果

请求通常不会被缓存,因为每次POST请求都可能导致服务器上的数据被修改。

使用场景

通常用于检索数据、查询数据库等不需要修改服务器数据的场景。

通常用于提交表单、上传文件、创建新资源等需要修改服务器数据的场景。

传参方式data 与 params 的区别

比较项目

data 参数

params 参数

传输方式

放在请求体中传输

通过 URL 进行传输,拼接在 URL 末尾

使用场景

适用于 POST、PUT、PATCH 等非 GET 请求,用于向服务器提交数据以创建、更新或修改资源

主要用于 GET 请求,让服务器根据参数筛选、排序或返回特定资源

数据大小限制

相对没有严格的类似 URL 长度那样的限制(实际受服务器配置等因素影响),更适合大量数据传输

受 URL 长度限制,过长 URL 可能导致请求失败

安全性

不在 URL 中显示数据,一定程度上保护隐私和安全性,适合传递敏感信息

数据在 URL 上可见,不适合传递敏感信息如密码等

同步和异步

比较项

同步

异步

是什么

按顺序依次执行任务,后一个任务等待前一个完成。(不等于阻塞)

不等待任务完成就执行其他任务。

为什么要用

逻辑简单,保证数据一致性。

提高性能和效率,提升用户体验。

在哪用

简单计算、顺序依赖强的业务逻辑。

网络请求、文件操作、定时器和事件处理。

怎么用

按正常函数调用顺序执行。

用回调函数或 Promise(JS)、async/await(其他语言)。

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

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

相关文章

具有多个表盘、心率传感器、指南针和游戏的 DIY 智能手表

在此,我们将使用所学到的知识,结合使用硬件和软件组件从头开始创建自己的智能手表。在项目的这一部分,您将被指导完成组装硬件组件、设置软件以及配置智能手表的设置和功能的过程。到本项目结束时,您将拥有一款功能齐全的智能手表…

算法魅力之牛叉的前缀和

1.什么是前缀和 前缀和算法(Prefix Sum Algorithm) 是一种常用的算法技巧,用于快速计算数组的某些子数组的和。它通过提前计算出数组中元素的累加和,来加速后续的区间和查询,特别适用于需要频繁查询子数组和的场景。 …

Java JVM(内存结构,垃圾回收,类加载,内存模型)

一、JVM 主要功能 1. 什么是 jvm? JVM(Java Virtual Machine):负责运行 Java 程序的核心组件。它将 Java 字节码(.class 文件)解释或编译为机器代码,并提供内存管理、垃圾回收和线程管理等功能。 JRE (J…

机器学习基础之集成学习

集成学习(Ensemble Learning)是一种强大的机器学习方法,它通过结合多个模型的预测结果来提高整体的学习效果。集成学习方法在许多实际应用中表现出了优秀的性能,尤其在处理复杂问题时,它常常能够比单一模型取得更好的结…

33 基于单片机的智能窗帘控制系统

目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 基于51单片机,采用DHT11温湿度传感器检测温湿度,滑动变阻器连接ADC0832数模转换器转换模拟,光敏传感器,采用GP2D12红外传感器,通过LCD1602显示屏显示…

使用docker-compese部署SFTPGo详解

官网:SFTP & FTP as a Managed Service (SaaS) and On-premise 一、SFTPGo简介 SFTPGo 是一款功能强大的文件传输服务器软件。它支持多种协议(SFTP、SCP、FTP/S、WebDAV、HTTP/S)和多个存储后端。 借助 SFTPGo,您可以利用本地…

我与Linux的爱恋:消息队列

​ ​ 🔥个人主页:guoguoqiang. 🔥专栏:Linux的学习 文章目录 消息队列的引入以及基本概念**​消息队列的基本概念** 消息队列与命名管道和共享内存的不同消息队列的原理消息队列工作流程 System V 消息队列的主要函数msggetms…

LWIP和FATFS 实现 FTP 服务端

目录 一、前言 二、LWIP 和 FTP 简介 1.LWIP 2.FTP 三、实现 FTP 服务端的主要步骤 1.初始化 LWIP 2.创建 FTP 服务器任务 3.处理客户端连接 4.实现 FTP 命令处理 5.文件系统操作 6.错误处理和日志记录 四、示例代码 1.创建FTP任务 2. FTP任务代码 3.处理交互数据…

Java基础访问修饰符全解析

一、Java 访问修饰符概述 Java 中的访问修饰符用于控制类、方法、变量和构造函数的可见性和访问权限,主要有四种:public、protected、default(无修饰符)和 private。 Java 的访问修饰符在编程中起着至关重要的作用,它…

llvm源码编译

0x00 获取llvm源码 获取llvm项目源码:git clone https://github.com/llvm/llvm-project.git 但是,该项目较大,且直接从github下载源码可能会超时失败。可利用gitee的镜像项目进行clone:git clone --depth 1 https://gitee.com/m…

SpringBoot源码-Spring Boot启动时控制台为何会打印logo以及自定义banner.txt文件控制台打印

1.当我们启动一个SpringBoot项目的时候,入口程序就是main方法,而在main方法中就执行了一个run方法。 SpringBootApplication public class StartApp {public static void main(String[] args) {// testSpringApplication.run(StartApp.class);} }publi…

Uniad复现学习

在优云平台部署训练,加速训练。 关于UCloud(优刻得)旗下的compshare算力共享平台 UCloud(优刻得)是中国知名的中立云计算服务商,科创板上市,中国云计算第一股。 UCloud(优刻得)旗下的Compshare算力共享平台具有以下优点…

数学建模——Topsis法

数模评价类(2)——Topsis法 概述 Topsis:Technique for Order Preference by Similarity to Ideal Solution 也称优劣解距离法,该方法的基本思想是,通过计算每个备选方案与理想解和负理想解之间的距离,从而评估每个…

基于单片机的四位数码管检测有毒气体

目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 基于51单片机,通过滑动变阻器连接ADC0832数模转换器模拟有毒气体浓度检测,通过数码管实时显示,如果超过阈值,则蜂鸣器报警,灯光亮起。按…

小程序 - 比较数字大小

小程序交互练习 - 比较数字大小的小程序 目录 比较数字大小 功能描述 准备工作 页面内容 设置页面事件 页面绑定事件 比较大小 按钮绑定事件 比较事件 设置结果显示 页面样式 功能截图 总结 比较数字大小 本案例将实现“比较数字大小”微信小程序,它的…

windows下用mysqld启动免安装mysql

windows系统可以下载免安装版本,就是绿色版,里面包含mysql运行的所有必要条件。 ![[Pasted image 20241128231459.png]] 启动步骤: 解压,然后在解压目录创建my.ini。 [mysqld] # 设置13306端口 port13306# 设置mysql的安装目录…

windows安装itop

本文介绍 win10 安装 itop 安装WAMP集成环境前 先安装visual c 安装itop前需要安装WAMP集成环境(windowsApacheMysqlPHP) 所需文件百度云盘 通过网盘分享的文件:itop.zip 链接: https://pan.baidu.com/s/1D5HrKdbyEaYBZ8_IebDQxQ 提取码: m9fh 步骤一&#xff1…

Leetcode - 周赛425

目录 一,3364. 最小正和子数组 二, 3365. 重排子字符串以形成目标字符串 三,3366. 最小数组和 四,3367. 移除边之后的权重最大和 一,3364. 最小正和子数组 本题可以直接暴力枚举,代码如下: …

微服务即时通讯系统的实现(服务端)----(2)

目录 1. 语音识别子服务的实现1.1 功能设计1.2 模块划分1.3 模块功能示意图1.4 接口的实现 2. 文件存储子服务的实现2.1 功能设计2.2 模块划分2.3 模块功能示意图2.4 接口的实现 3. 用户管理子服务的实现3.1 功能设计3.2 模块划分3.3 功能模块示意图3.4 数据管理3.4.1 关系数据…

Matlab Simulink HDL Coder开发流程(一)— 创建HDL兼容的Simulink模型

创建HDL兼容的Simulink模型 一、使用Balnk DUT模板二、从HDL Coder库中选择模块三、为DUT开发算法/功能四、为设计创建Testbench五、仿真验证设计功能六、Simulink模型生成HDL代码 这个例子说明了如何创建一个用于生成HDL代码的Simulink模型。要创建兼容HDL代码生成的MATLAB算法…