💡异步编程发展历程:从回调地狱到async/await!

655 阅读3分钟

嗨,大家好!这里是道长王JJ~

今天将深入探索异步编程的前世今生,并揭开从回调地狱到async/await范式的历程。如果你还不认识node,还困惑于复杂的回调嵌套和错误处理,那么将为你带来眼前一亮的解决方案!

准备好了吗?让我们一起探索这个激动人心的异步世界吧!🚀

💡理解异步编程的重要性

在我们踏入异步编程的奇妙旅程之前,让我们先回顾一下异步编程的重要性。

异步编程是现代应用开发中不可或缺的关键概念。它不仅提升了应用的响应速度和用户体验,还为我们处理网络请求、读取文件和执行复杂计算等任务提供了强大的能力。

掌握异步编程,就意味着掌握了开发高效、灵活的应用的关键技巧。而node中原生api是以这样的形式存在的:

fs.readFile('xxx', (err, data) => { });

⛓️从原生 API 到 回调地狱

当我们使用原生提供的api函数作为异步操作的处理方式时,我们常常会陷入回调地狱的困境。

嵌套的回调层级不仅使代码难以阅读和维护,还增加了错误处理的复杂性。

看起来像是这样的:


fs.readFile('file01.json', (err, data) => { 
    fs.readFile('file02.json', (err, data) => { 
        fs.readFile('file03.json', (err, data) => { 
            fs.readFile('file04.json', (err, data) => { 
                // 处理文件读取结果 
            }); 
        }); 
    }); 
});

😍Promise的崭露头角

幸运的是,随着ES6的引入,Promise成为了解决回调地狱问题的理想方案。

Promise让我们可以以链式调用的方式组织异步操作,使代码更加清晰和易读。

同时,Promise还提供了错误处理机制,使我们能够更好地处理任务执行过程中的异常情况。看起来就像这样:


readFilePromise('file01.json')
    .then(data => { 
        return readFilePromise('file02.json'); 
    })
    .then(data => { 
        return readFilePromise('file03.json'); 
    })
    .then(data => { 
        return readFilePromise('file04.json'); 
    })
    .catch(error => { 
        console.error('读取文件出错:', error); 
    });


🔐Generator 函数与 co 的诞生

2013 年 6 月, TJ Holowaychuk大神运用 “自动执行器 Thunk 函数 + 自动执行器 Promise 对象” 创建了 co 运行库。

通过使用co库,我们可以按顺序依次执行异步操作,并以同步的方式书写代码了,这与如今的async/await的使用上十分相似。

这种优雅的风格让异步编程变得简洁、直观。看起来是这样的:


co(function* () { 
    const r1 = yield readFilePromise('file01.json'); 
    const r2 = yield readFilePromise('file02.json'); 
    const r3 = yield readFilePromise('file03.json'); 
    const r4 = yield readFilePromise('file04.json'); 
})
  .catch(error => { 
      console.error('执行异步操作出错:', error); 
  });

🌟异步和同步的完美结合:async/await

终于, 在es7中引入的asyncawait关键字。

通过将async关键字添加到函数前,我们可以将其默认转换为返回一个Promise对象的函数。

更重要的是,async/await让我们能够以同步的方式书写异步代码,而无需依赖第三方库的支持,使代码更加清晰、易读,为异步编程注入了全新的活力。

就像这样简单明了:


const readFileAsync = async function () { 
    const f1 = await readFilePromise('file01.json'); 
    const f2 = await readFilePromise('file02.json'); 
    const f3 = await readFilePromise('file03.json'); 
    const f4 = await readFilePromise('file04.json'); 
} catch (error) {
    console.error('读取文件出错:', error); 
}


🔑结语

这篇短文仅仅是简要回顾了这四种经典的异步编程方式。

尽管没有深入展开每个细节,但能对它们的本质和为何如此发展有了一点了解。

这是我在掘金尝试的第01篇文章,可能会有理解存在偏差的地方,欢迎指出,共同学习,共同进步。😊