回调地狱
需求是: 通过选择省,再去发请求,选择城市,再发请求,请求到区
$.ajax({
//全国有多少省
type:'get/post'
url:'www',
dataType:'json/jsonp'
async:true,
data:{
id:"1"
},
success:function(res){
console.log(res)
$.ajax({
//这个省有多少市
....
success:function(res){
$.ajax({
//这个市有多少区
....
success:function(res){
console.log(res)
....
//这个就叫回调地狱
}
})
}
})
},
error:function(){
},
complate:function(){
}
})
promise如何解决
new Promise(function(resolve,reject){
setTimeout(function(){
resolve('省')
},1000)
}).then(res=>{
console.log(res)
return new Promise(function(resolve,reject){
setTimeout(function(){
resolve('市')
},1000)
})
}).then(res=>{
console.log(res)
return new Promise(function(resolve,reject){
setTimeout(function(){
resolve('区')
},1000)
})
}).then(res=>{
console.log(res)
})
Promise all rase 的用法
// Promise.all()的用法 请求并发,数组里面异步调用必须都成功,才会执行 then 函数
let promise1 = Promise.resolve('1')
let promise2 = new Promise(function(resolve,reject){
setTimeout(function(){
reject('2')},1000)})
Promise.all([promise1,promise2]).then(res=>{
console.log(res)
}).catch(err=>{
console.log(err)
})
// Promise.race()的用法 执行先返回的promise对象的结果
let promise1 = new Promise(function(resolve,reject){
setTimeout(function(){
resolve("1")},3000)})
let promise2 = new Promise(function(resolve,reject){
setTimeout(function(){
resolve("2")},2000)})
Promise.race([promise1,promise2]).then(res=>{
console.log(res)
})
async 函数
// 什么是 async 函数
// 在普通函数前面加一个 async 就是 async 函数
// 需要搭配 await 使用 后面跟着异步调用
// async 函数会将函数的返回值 包装成一个 Promise 对象
// 在普通函数中 return 的意义是什么 ,是不是所有的函数都有返回值?
// 在函数中,返回值是 return 后面的数据,如果函数没有 return 就是 undefined
// function fn(){}
// console.log(fn())
//async 将函数的返回值包装成一个Promise对象,无论它是什么,哪怕是 undefined
// async function add(){
// let a1 = await Promise.resolve('1')
// let a2 = await Promise.resolve('2')
// return 1
// }
// add().then(res=>{
// console.log(res)
// })
async function add(){
//异步代码同步执行
let a1 = await new Promise(function(resolve,reject){
setTimeout(function(){
resolve('1')
},1000)
})
let a2 = await new Promise(function(resolve,reject){
setTimeout(function(){
resolve('2')
},2000)
})
console.log(a1)
console.log(a2)
}
add()
// console.log(add())