AXIOS使用
<script src=“https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js”\>\</script>
引入axios库，获取result并打印，在控制台内查看result包含的东西，再利用其获取数据
有axios(config)、axios.操作( ‘url’ , config)两种方法
操作指get、post等，url为字符串，config为对象，第一种方法的config内应该至少包含了url和method来表示链接和操作
多个数据使用花括号写成对象形式
URL的组成
url查询参数 axios : params
利用axio提交查询参数
后端返回的数据保存在result里，通过打印到控制台可查看
常用请求方法：增删查改 axios : method、data
实际上在传输数据时，data部分会被自动转化为json格式
axios错误处理 catch( e => {} )
如：重复注册用户名
HTTP协议
http请求报文
通过请求报文可以排查错误由前端还是后端造成，方法是查看网络面板中的请求体
http响应报文
杂项
接口文档
form-serialize快速收集某个表单内表单元素的值
<script src=” https://unpkg.com/form-serialize@0.7.2/form-serialize.min.js”> </script>
返回的data内，表单元素name的值为属性，value的值为属性值
*建议name的值与接口文档给出的参数名一致
hash的true/false表示js对象/查询字符串(如下);
empty为true表示允许取值为空的属性及其值
引入bootstrap实现模态框效果
菜鸟教程的文档：Bootstrap CSS 概览 | 菜鸟教程
首先引入js和css
js放在body里
<script src=“https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/js/bootstrap.min.js”\>\</script>
css要放在head里
<link href=“https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.min.css” rel=“stylesheet”>
代码示例如下
<h2>创建模态框（Modal）</h2>
<!— 按钮触发模态框 —>
<button class=“btn btn-primary btn-lg” data-toggle=“modal” data-target=“#myModal”>开始演示模态框</button>
<!— 模态框（Modal） —>
<div class=“modal fade” id=“myModal” tabindex=“-1” role=“dialog” aria-labelledby=“myModalLabel” aria-hidden=“true”>
<div class=“modal-dialog”>
<div class=“modal-content”>
<div class=“modal-header”>
<button type=“button” class=“close” data-dismiss=“modal” aria-hidden=“true”>×</button>
<h4 class=“modal-title” id=“myModalLabel”>模态框（Modal）标题</h4>
</div>
<div class=“modal-body”>在这里添加一些文本</div>
<div class=“modal-footer”>
<button type=“button” class=“btn btn-default” data-dismiss=“modal”>关闭</button>
<button type=“button” class=“btn btn-primary”>提交更改</button>
</div>
</div><!— /.modal-content —>
</div><!— /.modal —>
</div>
属性控制弹框
对于要显示弹框的按钮，添加data-bs-toggale属性
对于要隐藏弹框的按钮，添加data-bs-dismiss属性
以上属性的值为弹框类型，如”modal”
为按钮指定弹框，添加data-bs-target属性，值为css选择器
js控制弹框
console.log与console.dir的区别
宏任务与微任务
异步任务里微任务先执行，其次才是宏任务。
微任务不会经过宿主环境而直接进入微任务队列。宏任务由浏览器进行计时等操作后放入宏任务队列
Promise
失败时一般传入一个error对象
生成Promise的参数是回调函数，其参数也是两个回调函数
调用resolve或者reject传入的值就是then和catch的形参
promise三种状态
回调函数地狱
利用链式调用解决回调函数地狱
axios也可以如此使用，可以重复使用.then
这里用了三个.then
Promise.all静态方法（可以结合axios用，质是promise）
result返回结果对象的数组，顺序与传入的promise对象数组一致
async函数和await关键字
await必须用在async修饰的函数内，await会阻止异步函数内的代码执行，原地等待结果
错误捕获：使用try catch
XMLHttpRequest
用xhr获得的数据是json类型，需要自己转为数组类型
XHR查询参数
携带的查询参数需要由自己手动加到url中
XHR提交数据
用XHR提交数据，需要自己设置请求头和请求体。
请求头要告知服务器自己传递的内容类型是JSON
请求体要手动转成JSON字符串
Promis+XHR模拟Axios
响应状态码保存在status内，需要判断响应状态来调用resolve/reject
如果axios要携带数据，还需要判断有没有data
如果这篇文章对你有帮助，欢迎分享给更多人！
部分信息可能已经过时