promise鏈式調用
**then 是成功回調,只要在then後邊return一個promise
就可以繼續then**
<script type="text/javascript">
let p1=new Promise(function(resolve,reject){
setTimeout(function(){
resolve()//成功回調
// reject()//失敗回調
},2000)//2秒後執行後邊的then、catch函數
})
p1.then(function(res){
console.log("成功執行then"+res)
// 在準備第二個promise對象
let p2=new Promise(function(resolve,reject){
setTimeout(function(){
resolve()
},1000)
})
return p2
}).then(function(){
console.log("我是p1 then後邊的第二個then")
})
p.catch(function(){
console.log("失敗執行catch")
})
</script>
解決回調地獄的終極方法 async/await ES7的語法,可以通過 async/await讓代碼看起來像同步的
async異步 await等待
await 等待 就是當後面跟的是promise對象,就讓他停止 ,先讓裏面的異步事情做完,在把結果返回給前面的新變量,在繼續向後執行
他只生效當前作用域內部,也就是async函數內部。
pGetSend 是一個異步的ajax請求
await會等待這個異步函數請求結束,並把結果給前面的res變量以後,在向後執行代碼。
async/await 語法
async/await 是es7的新增語法,是爲promise設計的語法。
是回調地獄的終極解決方案,就是用async/await語法把–異步代碼寫的看起來像同步的代碼。
語法規範:
1 async關鍵字寫在--函數的前面,就把該函數變成了一個異步函數
2 await是一個寫在 異步函數裏面的關鍵字
3 await關鍵字後面的必須是一個promise對象
滿足以上三個條件,就可以把本該在promise的then回調裏面接受的結果 ,放在await關鍵字前面定義一個變量來接受了。
**語法:
async 必須寫在函數前邊
await 關鍵字 後邊必須跟着Promise對象
async function fn(){}**
**<!-- 語法兼容可以藉助babel 直接百度即可 -->**
<script type="text/javascript">
function pGetSend(url){
let p=new Promise(function(resolve,reject){
let xhr=new XMLHttpRequest()
xhr.open('get',url)
xhr.οnlοad=function(){
resolve(xhr.responseText)
}
xhr.send()
})
return p
}
async function fn(){
// 1請求1
let res =await pGetSend("url.php")
let result=JSON.parse(res)
console.log("1"+res)
// 2 次
let res2=await pGetSend("url.php?key=value&key1=vlaue1")
let result2=JSON.parse(res2)
console.log("2"+res2)
}
fn ()
</script>