很久没有更了，今天就来谈一下回调地狱。回调地狱的官方理解上说的是函数作为参数层层嵌套看起来很好理解，实际上就是我们在做原生JS的时候产生的回调函数，因为函数闭包特性，所以产生层级嵌套，
当我们在执行DOM事件操作时,浏览器会悄悄向服务端发送很多的没有必要的http请求,携带后台可识别的参数,等待服务器响应返回数据,这个过程是异步回调的,当许多功能需要连续调用,环环相扣依赖时,它就像多层蛋糕一样。代码全部一层一层的嵌套,看起来就很庞大,很难以理解,这种情况下就产生了回调地狱.
那么回调地狱究竟应该怎样去解决呢？
出现回调地狱的最主要原因就是自己在编写代码的过程中过于刻板，循规蹈矩，以至于不断在一层函数下接着进行第二层，已达到第二层代码的执行效果。但很明显效果事半功倍。
首先我们可以在编写自己的代码的过程中可以优化自己的代码，比如说简单的命名函数这一块，我们不能杂乱无章的写一堆出来，可以对函数命名，简单明了。当发生异常时,你将获得引用实际函数名称而不是
“匿名”的堆栈跟踪。要时刻保持自己的代码简短美观。
模块化。如果一堆人都去做一件事情，每个人都有自己的思想，如果现在合理分配，每个人都有自己负责的，最后整合到一起是不是会有条理很多呢？同理，这里我们就用到了模块化开发。创建一个JS文件，
将一些重复出现的代码切割，模块化开发，当有需要的时候直接调用。会简单很多。还有像vue框架中常出现的import文件导出也属于模块化开发。
还有Promise方法，采用的执行方式也是由上而下的方式。多用在异步编程解决方案上。但是它也是书写代码不美观，有一种缩小版的回调既视感。
所以比较接近完美的方法比如像Async functions
Async functions是异步函数是一个建议的ES7功能，它将以更高级别的语法进一步包装生成器和继承
async 表示这是一个 async 函数，await 只能用在这个函数里面
await 表示在这里等待 Promise 返回结果后，再继续执行
await 后面跟着的应该是一个 Promise 对象（当然，其他返回值也没关系，只是会立即执行）
await 等待的虽然是 Promise 对象，但不必写 .then() ，可以直接得到返回值
function buildCatList(list, returnVal) {
return new Promise(function (resolve, reject) {
setTimeout(function (name) {
var catList = list === '' ? name : list + ',' + name
resolve(catList)
}, 200, returnVal)
}
)
}
function fn(list) {
return list + ',' + 555
}
async function render() {
var a = await buildCatList('','Panther')
var b = await buildCatList(a, 'Jaguar')
var c = await buildCatList(b, 'Lion')
var d = await fn(c)
console.log(d)
}
render()
这样看代码是不是简洁清晰，异步代码也具有了“同步”代码的结构。
网友评论