- A+
什么是地狱回调？解决回调地狱的两种方法
地狱回调概念：回调函数套回调函数的情况就叫做回调地狱，
//地狱回调
setTimeout(function () { //第一层
console.log('武林要以和为贵');
setTimeout(function () { //第二程
console.log('要讲武德');
setTimeout(function () { //第三层
console.log('不要搞窝里斗');
}, 1000)
}, 2000)
}, 3000)
promise解决方式
// promise解决方式
function fn(str) {
var p = new Promise(function (resolve, reject) {
//处理异步任务
var flag = true;
setTimeout(function () {
if (flag) {
resolve(str)
}
else {
reject('操作失败')
}
})
})
return p;
}
fn('武林要以和为贵')
.then((data) => {
console.log(data);
return fn('要讲武德');
})
.then((data) => {
console.log(data);
return fn('不要搞窝里斗')
})
.then((data) => {
console.log(data);
})
.catch((data) => {
console.log(data);
})
async/await解决方式
//封装一个返回promise的异步任务
function fn(str) {
var p = new Promise(function (resolve, reject) {
var flag = true;
setTimeout(function () {
if (flag) {
resolve(str)
} else {
reject('处理失败')
}
})
})
return p;
}
//封装一个执行上述异步任务的async函数
async function test() {
var res1 = await fn('武林要以和为贵'); //await直接拿到fn()返回的promise的数据，并且赋值给res
var res2 = await fn('要讲武德');
var res3 = await fn('不要搞窝里斗');
console.log(res1, res2, res3);
}
//执行函数
test();
————————————————
先来看一个小例子
var fs = require('fs')
fs.readFile('./src/a.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
})
fs.readFile('./src/b.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
})
fs.readFile('./src/c.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
})
执行结果
说明
在里面依次读取了三个文件，如果都是从上往下依次执行，那么应该都是先a后b在c，但是因为读取文件是异步操作，执行时是不会等待的，所以全看谁先读完，因此导致第三次结果改变。
使用回调解决上述问题
var fs = require('fs')
fs.readFile('./src/a.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
fs.readFile('./src/b.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
fs.readFile('./src/c.txt', 'utf-8', function(err, data) {
if (err) {
throw err
}
console.log(data)
})
})
})
执行结果
说明
完全一致，但是代码太过丑陋不方便维护
什么是回调地狱
就是上面那种，一个异步请求套着一个异步请求，一个异步请求依赖于另一个的执行结果，使用回调的方式相互嵌套。
这会导致代码很丑陋，不方便后期维护
