async / await重写Promise是如何工作的呢?

您会注意到,我们已经将代码包装在一个函数中,并且在async关键字之前包含function关键字。这是必要的-您必须创建一个异步函数来定义代码块,在其中运行异步代码;如前所述,await仅在异步函数内部起作用。

myFetch()函数定义内部,您可以看到代码与先前的Promise版本非常相似,但是有一些区别。无需.then()在每个基于promise的方法的末尾链接块,只需await在方法调用之前添加一个关键字,然后将结果分配给变量即可。await关键字使JavaScript的运行时暂停在此行代码,允许其他代码在此期间执行,直到异步函数调用返回其结果。完成后,您的代码将从下一行开始继续执行。例如:

let response = await fetch('coffee.jpg');

当该响应变为可用时,将由已实现的fetch()Promise返回的响应分配给该response变量,并且解析器会在此行暂停直到发生这种情况。一旦响应可用,解析器将移至下一行,从而从中创建Blob一行该行还调用了一个基于异步诺言的方法,因此我们await也在这里使用当运算结果返回时,我们将其从myFetch()函数中返回

这意味着当我们调用该myFetch()函数时,它将返回一个promise,因此我们可以将a链接.then()函数的末尾,并在其中处理屏幕上显示的blob。

您可能已经在考虑“这真的很酷!”,而且您是对的-更少的.then()代码包装块,而且大多数看起来就像是同步代码,因此非常直观。

原文地址:https://www.cnblogs.com/furuihua/p/13859368.html