asyncawait的缺点,async await的缺点
如何优雅处理 async await 错误——解读小而美的 awaitjs 库
最近有在读一些比较优秀的npm包的代码,起因是感觉自己现在写的代码还是不够规范,不够简洁。
可是我又不知道到底什么样的代码才算是比较 好 的代码,在进行一番思考过后我认为还是要站在巨人的肩膀上。
通过阅读优秀的源码并从中学习如何写出让人觉得赏心悦目的代码最后再写文进行章总结对整个学习的过程进行一个梳理同时分享给其他人。
为什么要在开头写这么多呢？因为我需要为自己坚持下去找一个理由。这样我才能乘风破浪,一往无前。
话不多说,开始总结。
在正式介绍await-to-js这个库之前,让我们先简单的回顾一下有关于在JavaScript这门语言中,异步编程的进化之路。在Promise没出现之前,异步编程一直是困扰着前端工程师的一个大难题,当时的前辈可能会经常看到下面这种代码。
这种同时在纵向和横向延伸的回调中嵌套着回调的代码又被称为 回调地狱 。可见这玩意让人多么恶心,具体来说有以下这几个缺点
Promise是一种 优雅 的异步编程解决方案。从语法上来将,它是一个对象, 代表着一个异步操作最终完成或失败,从语意上来讲,它是承诺,承诺过一段时间给你一个结果。
由于它的原型存在then,catch,finally会返回一个新的promise所以可以允许我们链式调用,解决了传统的回调地狱的问题。
由于它本身存在all方法,所以可以支持多个并发请求,获取并发请求中数据。
有了Promise后,上面的代码可以被写成下面这样。
相比较于上面的回调地狱,使用Promise可以帮助我们让代码只在纵向发展,并且提供了处理错误的回调。显然优雅了很多。不过就算Promise已经这么优秀了,可是依然存在两个每种不足的地方
async 函数是 Generator 函数的语法糖。使用 关键字 async 来表示，在函数内部使用 await 来表示异步。相较于 Generator ， async 函数的改进在于下面四点：
此处总结参考自： 理解async/await[1]
有了async/await,上面的代码可以被改写成下面这样
同时我们可以对每一次异步操作进行错误处理
这样一来上面Promise存在的两个每种不足的地方是不是就被优化了呢？所以说async/await是JS中异步编写的最后解决方案我个人觉得一点问题没有,但是我不知道你看上面的代码,每一次异步操作都要用try/catch进行错误处理是不是感觉不够方便不够智能呢?
作者是这样介绍这个库的
中文翻译过来就是
这里做个简单的对比,之前我们在异步操作中处理错误的方法是这样的
而用了await-to-js之后,我们可以这样的处理错误
是不是简洁多了呢?
作者究竟用了什么黑魔法?
你可能不信，源码只有仅仅15行。
上面这里是TS版的源码,但是考虑到有些同学可能还没接触过TS,我着重分析一下下面这版JS版的源码。
这里我们先抛开errorExt这个自定义的错误文本,核心代码是这样的
可以看出,其代码的逻辑用中文解释是这样的
经过上面的分析我们可以认定,世界上没有什么黑魔法,没有你做不到,只有你想不到。
这里我们再来看函数to的第二个参数errorExt不难发现,这玩意其实就是拿来用户自定义错误信息的,通过 Object.assign 将正常返回的error和用户自定义和合并到一个对象里面供用户自己选择。
源码不可怕,可怕的是自己的面对未知的恐惧感。
敢于面对,敢于尝试,才能更上一层楼。
继续加油,少年。
[1]
:
[2]
How to write async await without try-catch blocks in Javascript:
async await和promise区别是什么?
两者的区别如下：
Promise的出现解决了传统callback函数导致的“地域回调”问题，但它的语法导致了它向纵向发展行成了一个回调链，遇到复杂的业务场景，这样的语法显然也是不美观的。
而async await代码看起来会简洁些，使得异步代码看起来像同步代码，await的本质是可以提供等同于”同步效果“的等待异步返回能力的语法糖，只有这一句代码执行完，才会执行下一句。
async await与Promise一样，是非阻塞的。
async await是基于Promise实现的，可以说是改良版的Promise，它不能用于普通的回调函数。
两者的概念：
Promise。
Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大，简单地说，Promise好比容器，里面存放着一些未来才会执行完毕（异步）的事件的结果，而这些结果一旦生成是无法改变的。
async await。
async await也是异步编程的一种解决方案，他遵循的是Generator 函数的语法糖，他拥有内置执行器，不需要额外的调用直接会自动执行并输出结果，它返回的是一个Promise对象。
两者的主要用法、语法就不赘述了，感兴趣的同学可以自行查阅 es6中文文档。
promise和async await区别是什么?
promise和async await区别是：
1、简洁干净
使用async/await能省去写多少行代码。
2、错误处理
async/wait能用相同的结构和好用的经典try/catch处理同步和异步错误，错误堆栈能指出包含错误的函数。
3、调试
async/await的一个极大优势是它更容易调试，使用async/await则无需过多箭头函数，并且能像正常的同步调用一样直接跨过await调用。
Async await进一步优化了Promise的缺点，使代码更简洁。
函数前使用关键字async，await只能用在async标记的函数内。比promise更简洁处理结果上：promise需要使用．then()来处理promise返回的结果，而async/await则直接在代码上顺序处理结果。
promise的诞生是为了简化函数嵌套调用流程，也便于后续维护。
async/await定义了异步函数，并在其内部可通过await等待promise对象，阻塞后续的执行。
async与await的缺点以及解决
在这里，我们将三个Promise对象存储在变量中，这样可以同时启动它们关联的进程。
接下来，我们等待他们的结果 - 因为promise都在基本上同时开始处理，promise将同
时完成;当运行第二个示例时，您将看到弹出框报告总运行时间仅超过3秒！