結構:
//什么情況下會用到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()
這個用於:需求:需要同時獲取兩個或多個數據,之后才能下一步
用於判斷是否接受到了或者叫判斷執行完成了這兩個或多個請求
