🎶 Sym - 一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)平台

📕 链滴笔记 - 一款桌面端笔记应用,支持 Windows、Mac 和 Linux

🎸 Solo - B3log 分布式社区的博客端节点,欢迎加入下一代社区网络

♏ Vditor - 一款浏览器端的 Markdown 编辑器

如何避免地狱回调?

2019-03-20

提问

如何避免以下这种地狱回调的情况?

getData(function(a) {
  getMoreData(a, function(b) {
    getMoreData(b, function(c) {
      getMoreData(c, function(d) {
        getMoreData(d, function(e) {
          // ...
        })
      })
    })
  })
})

回答

重构返回 promises 的函数,使用最佳的 async/await 进行替换。替代回调函数导致的深层次嵌套,async/await 返回一个可以 await 的 promise,当异步数据返回后才允许以同步的方式执行下一行代码。

以上的代码可以如下进行重构:

async function asyncAwaitVersion() {
  const a = await getData()
  const b = await getMoreData(a)
  const c = await getMoreData(b)
  const d = await getMoreData(c)
  const e = await getMoreData(d)
  // ...
} 

加分回答

  • 有很多方法可以解决此类回调地狱的问题:
    • 模块化:将回调分解为独立的函数
    • 使用第三方库,如 async
    • 使用带有 Promise 的生成器
    • 从 v7 开始使用 async/await
  • 作为一个有能力的 JavaScript 开发人员,我们必须避免不断增长的缩进,使用干净且可读的代码来处理复杂的流程。

返回总目录

30 秒面试系列一


欢迎注册黑客派社区,开启你的博客之旅。让学习和分享成为一种习惯!

2 评论
KsRyY • 2019-09-06
回复 删除

问题在于 Async/Await 的错误处理需要用传统的 Try/Catch 模式,有点烦。

Vanessa • 2019-09-06
回复 删除

需要 catche 的地方都避免不了