promise async await
<!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>
<div>button</div>
<script>
const div=document.querySelector('div')
div.addEventListener('click',async ()=>{
const b1=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET','server/a.php')
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b1)
const b2=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET',`server/b.php?a=${b1.a}&b=${b1.b}`)
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b2)
const b3=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET',`server/c.php?c=${b2.c}&d=${b2.d}`)
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b3)
})
async function fn(){
const b1=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET','server/a.php')
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b1)
const b2=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET',`server/b.php?a=${b1.a}&b=${b1.b}`)
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b2)
const b3=await new Promise((resolve,reject)=>{
const xhr=new XMLHttpRequest()
xhr.open('GET',`server/c.php?c=${b2.c}&d=${b2.d}`)
xhr.onload=function(){
resolve(JSON.parse(this.responseText))
}
xhr.send()
})
console.log(b3)
}
console.log('before')
fn()
console.log('after')
setTimeout(()=>{
console.log(22222222)
},1000)
</script>
</body>
</html>