ajax学习笔记

文章目录

AJAX

一、ajax用处

浏览器和服务器之间通信,动态数据交互

二、axios使用语法
三、认识url
1、定义

统一资源定位符,简称网址

2、url组成
3、url查询参数
  • 定义:浏览器提供给服务器的额外信息,让服务器返回浏览器想要的数据
  • 语法:

    • 使用axios提供的param选项
四、常用请求方法
1、axios请求配置
  • url
  • method:请求的方法,get可以省略
  • data:提交数据
五、HTTP响应状态码
六、HTTP响应报文的组成
  • 响应行:协议、HTTP响应状态码、状态信息
  • 响应头:以键值对的格式携带的附加信息,比如Content-Type
  • 空行:分隔响应头,空行之后的是返回给浏览器的资源
  • 响应体:返回的资源
七、form-serialize插件
  • 作用:快速收集表单元素的值

  • 语法:

1、注意事项
  • 参数一:要收集哪个表单的数据
    • 表单元素设置name属性,值会作为对象的属性名
    • 建议name属性的值,最好和接口文档参数名一致
  • 参数二:配置对象
    • hash 设置获取数据结构
      • true:JS对象 一般请求体里提交给服务器
      • false:查询字符串
    • empty:设置是否获取空值 推荐获取空值
八、bootstrap弹框使用
1、弹框使用步骤
  • 引入css和js库,且初始不可见
  • 通过自定义属性,控制弹框的显示和隐藏:
九、图书管理
1、渲染列表

自己的图书数据:给自己起个外号,并告诉服务器,默认会有三本书,基于这三本书做数据的增删改查

  • 方法:
js 复制代码
axios({
    url:'......'
    params: {
    creator: '....'
}
})
十、图片上传
  • 获取图片文件对象
  • 使用FormData携带图片文件
  • 提交表单数据到服务器,使用图片url地址
十一、Promise
1、定义:用于表示异步操作的最终完成(或失败)及其结果值
2、好处:
  • 逻辑更清晰
  • 了解axios函数内部运作
  • 能解决回调函数地狱的问题
3、语法
4、promise对象三种状态
十二、同步和异步
1、同步:逐行执行,需原地等待结果后,才继续向下运行
2、异步:调用后耗时,不阻塞代码继续执行(不必原地等待,在将来完成后触发一个回调函数)
十三、回调函数地狱
1、概念:在回调函数中嵌套回调函数,一直嵌套下去就形成了回调函数地狱
2、缺点:可读性差,异常无法捕获,耦合性严重,牵一发而动全身
十四、Promise - 链式调用(可有效解决回调地狱问题)
  • 概念: 依靠then方法会返回一个新生成的Promise对象特性,继续串联下一环任务,直到结束
  • 细节: then()回调函数中的返回值,会影响新生成的Promise对象最终状态和结果
  • 做法: 每个Promise对象中管理一个异步任务,用then返回Promise对象,串联起来
十五、async函数和await

可以让我们用一种更为简洁的方式写出基于Promise的异步行为而无需可以地链式调用Promise

  • 概念:在async函数内使用await关键字取代then函数,等待获取Promise对象成功状态返回值
1、捕获错误

try...catch使用

十六、事件循环
1、概念:JS有一个基于事件循环地并发模型,事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。
2、原因:JS是单线程的,为了让耗时代码不阻塞其他代码运行,设计了事件循环模型
3、执行过程
  • 执行同步代码,遇到异步代码交给宿主浏览器环境执行
  • 异步有结果后,把回调函数放入任务队列排队
  • 当调用栈空闲后,反复调用任务队列里的回调函数
相关推荐
许白掰16 分钟前
Linux入门篇学习——借助 U 盘或 TF 卡拷贝程序到开发板上
linux·学习·借助 u 盘拷贝程序到开发板上·借助 tf卡拷贝程序到开发板上
Norvyn_71 小时前
LeetCode|Day18|20. 有效的括号|Python刷题笔记
笔记·python·leetcode
Y4090012 小时前
C语言转Java语言,相同与相异之处
java·c语言·开发语言·笔记
笑衬人心。2 小时前
TCP 拥塞控制算法 —— 慢启动(Slow Start)笔记
笔记·tcp/ip·php
花海如潮淹2 小时前
前端性能追踪工具:用户体验的毫秒战争
前端·笔记·ux
Andy杨3 小时前
20250718-5-Kubernetes 调度-Pod对象:重启策略+健康检查_笔记
笔记·容器·kubernetes
杭州杭州杭州8 小时前
Python笔记
开发语言·笔记·python
iFulling12 小时前
【计算机网络】第四章:网络层(上)
学习·计算机网络
香蕉可乐荷包蛋12 小时前
AI算法之图像识别与分类
人工智能·学习·算法