是否可以在 Js 中使用 await 而不使用 async

Question

await 是 es7 中的一个了不起的特性。

然而，每次使用await时，我发现我必须定义一个异步函数并调用这个函数。

比如

    async function asy(){
        const [resCityGuess,resCityHot,resCityAll]=await Promise.all([
                        this.http.get('api/v1/cities?type=guess'),
                        this.http.get('api/v1/cities?type=hot'),
                        this.http.get('api/v1/cities?type=group')
        ])
        this.cityGuessName=resCityGuess.data.name;
        this.cityGuessId=resCityGuess.data.id;
        this.cityHot=resCityHot.data;
        this.cityAll=resCityAll.data;
    }
    asy.apply(this);

我想要的是不带async函数的await，比如

        // the async function definition is deleted
        const [resCityGuess,resCityHot,resCityAll]=await Promise.all([
                        this.http.get('api/v1/cities?type=guess'),
                        this.http.get('api/v1/cities?type=hot'),
                        this.http.get('api/v1/cities?type=group')
        ])
        this.cityGuessName=resCityGuess.data.name;
        this.cityGuessId=resCityGuess.data.id;
        this.cityHot=resCityHot.data;
        this.cityAll=resCityAll.data;
        // without call fn

我认为定义函数fn并调用这个fn有时会重复所以我想知道是否可以优化这种情况？

我可以在没有 async 的情况下使用 await 吗？

非常感谢！

Answer 1

否。 await 运算符仅在 async 函数中有意义。

edit — 详细说明：整个 async 和 await 交易可以看作是一个 LISP 宏。该语法的作用是告知语言解释系统正在发生的事情，以便它可以有效将周围代码的转换合成为基于 Promise 的回调请求序列。

因此，使用语法是编码显式 Promise 内容的隐式捷径，调用 .then() 等。运行时必须知道函数是 async，因为那样它知道函数内部的 await 表达式需要通过生成器机制转换为 return Promise。而且，由于重叠的原因，函数声明上的 async 装饰告诉语言这实际上是一个 return 是 Promise 的函数，它需要处理它。

所以，这很复杂。改进和扩展 JavaScript 的过程必须考虑到这样一个事实，即世界上有难以想象的大量 JavaScript 代码，因此在几乎所有情况下，没有任何新功能可以使页面保持原样，因为2002 年失败。

edit — 现在，在 2021 年这里，有关于 await 调用如何在模块的外部级别工作的规则。它与 async 函数情况下的工作方式不太一样，但很相似。

Answer 2

已提交给 ECMAScript。

Chrome/Chromium（以及任何具有最新的基于 V8 的 JS 引擎的东西）都有一个看起来符合规范的工作实现。

提案本身处于第 3 阶段。

更多信息：

https://github.com/tc39/proposal-top-level-await

https://v8.dev/features/top-level-await

Answer 3

顶级 await（await 没有 async）还不是 JavaScript 特征。

但是，从版本 3.8 开始，它可以在 Typescript.

中使用

为了使用它，需要进行以下配置（tsconfig.json）：

"module": "esnext" // or "system"
"target": "es2017" // or higher

更多信息：

https://typescript.tv/new-features/top-level-await-in-typescript-3-8/

Answer 4

解决方案

不完全没有async但看一看，这可能会有所启发。

您可以有效地创建一个 arrow function（有意匿名）。

Arrow functions are an ECMAScript2015 syntax for writing anonymous functions. They have a lot of features that separate them from the original function keyword in JavaScript, but in many cases they can be a drop-in replacement for anonymous functions.

添加 async keyword，用括号将函数括起来，并添加另一个设置为运行函数的括号。

在函数内部，使用 await 关键字。

像这样：

(async () => {
    console.log("Message in 5s");
    await new Promise((resolve) => setTimeout(() => resolve(), 5000));
    console.log("If you like it, show it");
})();

是否可以在 Js 中使用 await 而不使用 async

Is it possible to use await without async in Js

html

javascript

asynchronous

ecmascript-2017

解决方案