1、同步
- 一条一条数据按顺序执行
2、异步
- 前一条数据不影响后一条数据执行
3、前端中常见的两种异步情况
| 类型 | |
| 1、ajax | 向后台请求数据 |
| 2、计时器 | setInterval、setTimeout |
4、获取异步的方法（回调函数）-回调地狱
- 回调地狱：为了解决异步问题，不断嵌套回调函数，非常难维护
function getTea(fn) { setTimeout(() => { fn("奶茶"); }, 2000) } function getHotPot(fn) { setTimeout(() => { fn("火锅"); }, 1000) } // 回调地狱：为了解决异步问题，不断嵌套回调函数，非常难维护 getTea(function (data) { console.log(data); getHotPot(function (data) { console.log(data); }); }); // 输出结果：奶茶，火锅
5、获取异步的方法（Promise）
<script> let tea = new Promise((resolve, reject) => { setTimeout(() => { let flag = true; if (flag) { resolve("奶茶"); } else { reject("获取奶茶失败"); } }, 2000) }) let hotPot = new Promise((resolve, reject) => { setTimeout(() => { let flag = true; if (flag) { resolve("火锅"); } else { reject("获取火锅失败"); } }, 1000) }) // 按次序获取异步数据 tea.then((data) => { console.log(data); return hotPot; }).then((data) => { console.log(data); }).catch((err) => { console.log(err); }) </script>
6、获取异步的方法（async函数）
<script> let tea = new Promise((resolve, reject) => { setTimeout(() => { let flag = true; if (flag) { resolve("奶茶"); } else { reject("获取奶茶失败"); } }, 2000) }) let hotPot = new Promise((resolve, reject) => { setTimeout(() => { let flag = true; if (flag) { resolve("火锅"); } else { reject("获取火锅失败"); } }, 1000) }) // async函数（语法糖），跟同步非常类似 async function fun() { let dataTea = await tea; console.log(dataTea); let dataHotPot = await hotPot; console.log(dataHotPot); } fun(); </script>
