1.什麼是回調地獄
回調地獄:多個ajax的請求出現了先後的關係,如:
$.get('./json/a.json', function (value1) {
$.get('./json/b.json', function (value2) {
$.get('./json/c.json', function (value3) {
})
})
})
由於ajax是一個異步操作,因爲需要將每一個ajax變爲同步,保證嵌套的ajax可以使用上一級ajax請求返回值
2.解決回調地獄
es6
利用promise + ajax,將ajax變爲同步
function newPromise(url, params = {}) {
return new Promise((resolve, reject) => {
$.get(url, params,function (value) {
resolve(value)
})
})
}
newPromise('./json/a.json')
.then(bkey => {
return newPromise('./json/b.json?bkey'+ bkey)
}).then(ckey =>{
return newPromise('./json/c.json?bkey'+ ckey)
}
).then(msg =>{
console.log(msg)
})
es7
function newPromise(url, params = {}) {
return new Promise((resolve, reject) => {
$.get(url, params,function (value) {
resolve(value)
})
})
}
//es7
async function PromiseAjax(){
//解決異步執行,讓ajax變爲同步
let bkey = await newPromise('./json/a.json')
let ckey = await newPromise('./json/b.json',{bkey})
let cMsg = await newPromise('./json/c.json',{ckey})
}
PromiseAjax();