JS-回调地狱

一、什么是回调地狱

前端的ajax和jsonp内部充斥着大量的异步，为了能够拿到异步的数据，使用了大量的回调函数，来获取将来异步执行成功之后的数据。如果请求不多时还好，一旦请求的数量达到一定程度，并且复杂度提升以后，会造成一些问题，这就是回调地狱。

二、回调函数

在发送Ajax中，客户端和服务器之间的请求和响应都是需要时间的，而我们要拿响应回来的数据就必须等响应完成，这些都是回调函数的常用场景。

let fs = require('fs');

// 【异步函数读取】
// 读取a文件
fs.readFile("./a.txt","utf-8",(err,data)=>{
  if(!err){
    console.log(data)
  }
});

// 读取b文件
fs.readFile("./b.txt","utf-8",(err,data)=>{
  if(!err){
    console.log(data)
  }
});

// 读取c文件
fs.readFile("./c.txt","utf-8",(err,data)=>{
  if(!err){
    console.log(data)
  }
});

如上述代码所示：我们想按照书写顺序分别读取三个文档的内容，虽然顺序是a.txt ···> b.txt ··· > ···c.txt，但是结果却不是预期中的那样显示，这是因为读取文件都是异步函数，互不影响，所以他们的读取顺序是不确定的。为了让他们的顺序变成如我们所想的那样，一个接一个的，就必须进行嵌套 代码演示如下：

let fs = require('fs');

// 【异步函数读取】
// 读取a文件
fs.readFile("./a.txt","utf-8",(err,data)=>{
  if(!err){
    console.log(data)
    // 读取b文件
    fs.readFile("./b.txt","utf-8",(err,data)=>{
      if(!err){
        console.log(data)
        // 读取c文件
        fs.readFile("./c.txt","utf-8",(err,data)=>{
          if(!err){
            console.log(data)
          }
        });
      }
    });
  }
});

经测试，运行结果确实如我们所想，一个接一个运行，然而要继续向下写只能继续嵌套

如此一来便形成了回调地狱。回调地狱虽然将异步函数的执行顺序变为同步。

但是这样的代码阅读性非常不好，可维护性也很差。

在下一篇里我会讲解如何使用Promise解决回调地狱的问题。