1、什么是回调地狱?
假如我们有很多异步事件，而这些异步事件又有很紧密的联系，比如一个异步事件要依赖另一个异步事件的返回值，看下面的：
$.ajax({
url: '',
data: {},
type: 'post',
dataType: JSON,
success: function (res) {
$.ajax({
url: '',
data: res.data,
type: 'post',
dataType: JSON,
success: function (res1) {
$.ajax({
url: '',
data: res1.data,
type: 'post',
dataType: JSON,
success: function (res2) {
$.ajax({
url: '',
data: res2.data,
type: 'post',
dataType: JSON,
success: function (res3) {
console.log(res3)
}
})
}
})
}
})
}
})是不是进入了一环套一环的地狱里面。我们可以简单处理下：
function ajax1() {
$.ajax({
url: '',
data: {},
type: 'post',
dataType: JSON,
success: function (res) {
ajax2(res.data)
}
})
}
function ajax2(data) {
$.ajax({
url: '',
data: data,
type: 'post',
dataType: JSON,
success: function (res) {
ajax3(res.data)
}
})
}
function ajax3(data) {
$.ajax({
url: '',
data: data,
type: 'post',
dataType: JSON,
success: function (res) {
console.log(res)
}
})
}
ajax1();这样虽然把每个ajax请求放在了函数里面，不用把所有请求放在一个方法里面，但实际上还是在函数里面一层一层的嵌套来实现，很不便于阅读和维护
2、看看promise是如何解决的
promise的出现就是为了解决异步编程中的回调问题，它提供了统一的 API
const ajax1 = new Promise(function (resolve,reject) {
$.ajax({
url: '',
data: {},
type: 'post',
dataType: JSON,
success: function (res) {
resolve(res.data)
}
})
})
function ajax2 (data) {
return new Promise(function (resolve,reject) {
$.ajax({
url: '',
data: data,
type: 'post',
dataType: JSON,
success: function (res) {
resolve(res.data)
}
})
})
}
function ajax3 (data) {
return new Promise(function (resolve,reject) {
$.ajax({
url: '',
data: data,
type: 'post',
dataType: JSON,
success: function (res) {
resolve(res.data)
}
})
})
}
ajax1.then(function (data) {
return ajax2(data)
}).then(function (data) {
return ajax3(data)
})版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
