多个ajax同步|异步执行问题记录

【问题描述】

做了一个简单的前端页面，通过某个类别列表进行报表查询。

主要有两次ajax，一次是页面初始化的时候加载类别列表下拉框的数据，一次是点击查询时返回报表数据。

#-1> 初始化下拉列表：function initialPrdType() {}

#2-> 查询：SelectByPrd(){}

两次查询中的ajax都默认设置 async = true; 即异步方式的情况下：

只加载了产品类别，查询数据没有自动完成加载，但再点击查询按钮的时候可以正常加载

P.S. 默认不写明 async==true（异步），async=false（同步）

改成同步方式：asycn = false

可以正常加载，但是浏览器（chorme）输出以下警告：

 简单翻译一下：不建议在主线程上使用同步XMLHttpRequest，因为它会最终影响用户体验。

【原因分析】 

ajax请求一般情况下都建议用异步的，而不是同步的，原因是如果是同步的，在请求返回之前线程会一直阻塞，如果请求是在主线程中发起的，那就会造成整个浏览器阻塞，导致浏览器直接崩溃，因此用户体验是很不好的。

解决办法：直接改成异步方式就好，同时也不建议用同步。

-------------------------------------------------我是阿喵的分界线-----------------------------------------

但是有多个ajax同时并发操作会引发很多问题，虽然暂时没有遇到，先记录一下，未雨绸缪

页面多个ajax顺序执行：https://www.jianshu.com/p/c3624e38a1dd

JS中如何处理多个ajax并发请求：https://blog.csdn.net/weixin_42476601/article/details/82315877

前端如何处理多个异步请求并将多个请求的最终结果渲染给页面：https://blog.csdn.net/qq_20054391/article/details/83302340