在前端編程中尖滚，少不了用到異步展箱。提一個(gè)本人在之前實(shí)際編程遇到的問(wèn)題（ajax）：
在獨(dú)立的js文件中寫(xiě)統(tǒng)一提交ajax請(qǐng)求的函數(shù)：
function postApi (url, data) {
var result = {};
$.ajax({
url: url,
type: 'post',
data: data ? data : {},
success: (res) => {
result = res
},
fail: (err) => {
result = res
}
})
return result
}
然后在js調(diào)用postApi函數(shù)中:
var res = postApi(url, data)
看似可以，實(shí)際上根本不行属韧。因?yàn)閍jax是異步請(qǐng)求亮钦，所以返回的并不是result。當(dāng)然噪漾，使用async: false可以把a(bǔ)jax改為同步硼砰，返回值沒(méi)問(wèn)題，但是如果用的太多欣硼，頁(yè)面假死次數(shù)太多题翰，這樣會(huì)導(dǎo)致用戶體驗(yàn)不佳。這是大問(wèn)題！
用回調(diào)函數(shù)可以輕易解決這個(gè)問(wèn)題豹障，使用回調(diào)函數(shù)其實(shí)就是使用了閉包冯事，閉包會(huì)保存當(dāng)前的作用域，異步操作能在這個(gè)作用域中拿到準(zhǔn)確的數(shù)據(jù)血公。
1桅咆、修改postApi函數(shù)
function postApi ( url, data, cb ) {
$.ajax({
url: url,
type: 'post',
data: data ? data : {},
success: (res) => {
cb && cb(res)
},
fail: (err) => {
cb && cb(err)
}
})
}
2、然后使用postApi函數(shù)：
postApi(url, data, (res)) => {
console.log(res)
})
這樣一來(lái)就可以拿到正確的返回值了坞笙。使用postApi時(shí)附加了一個(gè)匿名函數(shù)做作為回調(diào)函數(shù)岩饼。
在promise中也可以這樣用：
function func(data, cb) {
return new Promise((resolve, reject) => {
if (data === 'OK') {
resolve(data)
} else {
reject(data)
}
}).then((data) => {
cb && cb('data為‘OK’')
}.catch(data) => {
cb && cb('data不是‘OK’')
})
}
func('OKK', (res) => {
console.log(res)
})
提一句，如果多次使用相似的數(shù)據(jù)處理薛夜，可以寫(xiě)一個(gè)統(tǒng)一的處理函數(shù)籍茧，然后將這個(gè)函數(shù)作為回調(diào)函數(shù)使用，我這里寫(xiě)的是匿名函數(shù)梯澜。
