|
|
@@ -0,0 +1,83 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <script src="./js/ajax.js"></script>
|
|
|
+ <script>
|
|
|
+ // 回调地狱
|
|
|
+ // ajax("GET","./data/a.json",function(res){
|
|
|
+ // ajax("GET","./data/b.json",function(res){
|
|
|
+ // ajax("GET","./data/c.json",function(res){
|
|
|
+ // console.log("成功了",res);
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+
|
|
|
+ // Promise 解决回调地狱问题
|
|
|
+ // 创建 Promise 实例 接收一个函数 函数内有两个参数 resolve 代表成功 reject 代表失败
|
|
|
+
|
|
|
+ // 成功的效果 调用 then 方法
|
|
|
+ // let p1 = new Promise((resolve,reject)=>{
|
|
|
+ // ajax("GET","./data/a.json",function(res){
|
|
|
+ // resolve(res);
|
|
|
+ // })
|
|
|
+ // });
|
|
|
+
|
|
|
+ // // 只要promise 中执行了 resolve 方法 就可以通过 then 方法获取到成功的结果
|
|
|
+ // p1.then(res=>{
|
|
|
+ // console.log(res);
|
|
|
+ // })
|
|
|
+
|
|
|
+ // 失败的效果 调用 catch 方法
|
|
|
+ // let p1 = new Promise((resolve,reject)=>{
|
|
|
+ // ajax("GET","./data/a.json",function(res){
|
|
|
+ // reject(res);
|
|
|
+ // })
|
|
|
+ // });
|
|
|
+ // // 只要promise 中执行了 reject 方法 就可以通过 catch 方法获取到失败的结果
|
|
|
+ // p1.catch(err=>{
|
|
|
+ // console.log(err);
|
|
|
+ // })
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // Promise.all 方法 同时执行多个 Promise 实例 等待所有 Promise 实例执行完成后 才调用 then 方法
|
|
|
+
|
|
|
+ let p1 = new Promise((resolve,reject)=>{
|
|
|
+ ajax("GET","./data/a.json",function(res){
|
|
|
+ resolve(res);
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ let p2 = new Promise((resolve,reject)=>{
|
|
|
+ ajax("GET","./data/b.json",function(res){
|
|
|
+ resolve(res);
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ let p3 = new Promise((resolve,reject)=>{
|
|
|
+ ajax("GET","./data/c.json",function(res){
|
|
|
+ resolve(res);
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ // Promise如果都成功就会执行 then 方法 如果有一个失败就会执行 catch 方法
|
|
|
+ // Promise.all([p1,p2,p3]).then((res)=>{
|
|
|
+ // console.log("全部成功",res);
|
|
|
+ // }).catch((res)=>{
|
|
|
+ // console.log("失败",res);
|
|
|
+ // })
|
|
|
+
|
|
|
+ // Promise.race() 只要第一个 Promise 实例执行成功 就会调用 then 方法 如果 Promise 实例执行失败 就会调用 catch 方法
|
|
|
+ // Promise.race([p1,p2,p3]).then((res)=>{
|
|
|
+ // console.log("成功",res);
|
|
|
+ // }).catch((res)=>{
|
|
|
+ // console.log("失败",res);
|
|
|
+ // })
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+</html>
|
