結構:
//什么情況下會用到Promise? //一把情況下是有異步操作時,使用Promise對這個異步操作進行封裝 <script> new Promise((resolve, reject) =>{ setTimeout(() =>{ //成功的時候調用resolve resolve('成功data') //失敗的時候調用reject reject('error message') }, 1000) }).then((data) =>{ //處理成功后的邏輯 console.log(data);//這個data 是接收的resolve參數-- }).catch((err) =>{ console.log(err); }) </script>
簡便寫法二
.then(函數一,函數二)
<script> new Promise((resolve, reject) =>{ setTimeout(() =>{ //成功的時候調用resolve resolve('成功data') //失敗的時候調用reject reject('error message') }, 1000) }).then(data =>{ console.log(data); }, err =>{ console.log(err) }) </script>
鏈式案例
<script> //模擬網絡請求 //網絡請求:aaa ->自己處理(10行) //處理:aaa111 ->自己處理(10 行) //處理:aaa111222->自己處理 new Promise((resolve, reject) =>{ setTimeout(() =>{ //成功的時候調用resolve resolve('aaa') }, 1000) }).then(res =>{ // 自己處理10行代碼 console.log(res,'第一層的10行處理代碼'); //2.對結果進行第一次處理 //return Promise.reject('err') //throw 'err' return Promise.resolve(res +'111') }) }).then(res =>{ console.log(res, '第二層的10行處理代碼') return Promise.resolve(res +'222') }) }).then(res =>{ console.log(res +'第三層代碼') }).catch(err =>{ console.log("err") }) </script> <script> new Promise((resolve, reject) =>{ setTimeout(() =>{ //成功的時候調用resolve resolve('aaa') }, 1000) }).then(res =>{ // 自己處理10行代碼 console.log(res,'第一層的10行處理代碼'); //2.對結果進行第一次處理 return Promres +'111' }) }).then(res =>{ console.log(res, '第二層的10行處理代碼'); return res +'222' }) }).then(res =>{ console.log(res +'第三層代碼'); }) </script>
此外,promise還有同時處理幾個或多個請求
Promise.all()
這個用於:需求:需要同時獲取兩個或多個數據,之后才能下一步
用於判斷是否接受到了或者叫判斷執行完成了這兩個或多個請求