<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script src="JQuery.js"></script>
<script>
// 拿到a的数据后才去请求b，拿到b的数据后再去请求c 这就叫回调地狱
// 像这种回调嵌套回调的写法就叫回调地狱
// $.ajax({
// method: "get",
// url: "data.json",
// success(res) {
// console.log(res);
// $.ajax({
// method: "get",
// url: "data2.json",
// success(res) {
// console.log(res);
// $.ajax({
// method: "get",
// url: "data3.json",
// success(res) {
// console.log(res);
// },
// });
// },
// });
// },
// });
//jq的ajax本身就是一个promise对象
// $.ajax({
// method: "get",
// url: "data.json",
// })
// .then((res) => {
// console.log(res);
// return $.ajax({
// method: "get",
// url: "data2.json",
// });
// })
// .then((res) => {
// console.log(res);
// return $.ajax({
// method: "get",
// url: "data3.json",
// });
// })
// .then((res) => {
// console.log(res);
// console.log("最终拿到的", res);
// });
//用promise 的方法处理回调地狱
// es7的时候出了一个async和await 是解决回调地狱的终极方案
async function getdata() {
let data = await $.ajax({
method: "get",
url: "data.json"
});
console.log(data);
let data2 = await $.ajax({
method: "get",
url: "data2.json"
});
console.log(data2);
let data3 = await $.ajax({
method: "get",
url: "data3.json",
});
console.log(data3);
return data3;
}
// async函数return的永远是一个promise对象
getdata().then((res) => {
console.log(res);
});
// function handler() {
// let data = ""
// $.ajax({
// method: "get",
// url: "data.json",
// success(res) {
// data = res;
// }
// });
// console.log(data);
// }
// handler()
function* getdata2() {
yield $.ajax({
method: "get",
url: "data.json"
})
yield $.ajax({
method: "get",
url: "data2.json"
})
yield $.ajax({
method: "get",
url: "data3.json"
})
}
let obj = getdata2();
obj.next().value.then(res => {
console.log(res);
return obj.next().value
}).then(res => {
console.log(res);
return obj.next().value
}).then(res => {
console.log("generator拿到的数据", res);
})
//用generator处理回调地狱 但是这种写法一般不用因为async已经取代了generotor
</script>
</body>
</html>
</html>