首页 web前端 js教程 JavaScript中如何使用async和await执行异步处理

JavaScript中如何使用async和await执行异步处理

Jan 10, 2019 pm 04:47 PM

Async/await是一个主要功能,可以更简洁有效地描述Promise的异步处理,异步处理是无需等待处理结果就能马上执行下一个处理的机制,它可以很容易地通过使用Promise来实现。

JavaScript中如何使用async和await执行异步处理

在Promise的情况下,我们使用“then”来连接,因此它会变成很单调的代码。

例如,如果使用“then”运行多个Promise进程,它看起来像这样:

getDate()
.then(function(data) {
    return getYear(data)
}) .then(function(year) {
    return getSomething(year)
}) .then(function(item) {
    getAnotherThing(item)
})
登录后复制

在某些情况下,使用Promise.all()可以更好的实现,但仍然必须使用then。

我们如果学习了如何使用async/await,这样就可以提高效率了。

如何使用async/await?

我们先来看一下基本的语法

async可以定义一个函数,只需在function之前写入就可以执行异步处理。

async function() { }
登录后复制

如果这样写async,这个函数将返回Promise。

此外,await是Promise处理的结果返回之前暂时停止的运算符。

await Promise处理
登录后复制

通过在描述Promise处理的函数之前简单地写await,它会暂停直到结果返回。

但是,请注意await只能用于async中定义的函数!

同样由于这个原因,async / await经常会成对的使用。

如何使用async/await编写异步处理?

首先,假设有以下Promise处理。

function myPromise(num) {
  return new Promise(function(resolve) {
 
    setTimeout(function() { resolve(num * num) }, 3000)
 
  })
}
登录后复制

这个例子,明白在Promise内记述着故意花费3秒的时间的处理。

如果使用async/await而不使用then ,则如下所示。

async function myAsync() {
    var result = await myPromise(10);
    console.log(result);
}
登录后复制

执行结果为:100

在这个例子中,通过赋予async来创建异步处理的函数。

描述函数内的Promise处理是myPromise()前的await

这将暂时等待Promise进程,该进程将在3秒后返回结果,并且一旦获得结果,函数内的进程将继续处理。

在执行结果中,可以获得给定参数10相乘的值100。

以上是JavaScript中如何使用async和await执行异步处理的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

在JavaScript中替换字符串字符 在JavaScript中替换字符串字符 Mar 11, 2025 am 12:07 AM

在JavaScript中替换字符串字符

jQuery获取元素填充/保证金 jQuery获取元素填充/保证金 Mar 01, 2025 am 08:53 AM

jQuery获取元素填充/保证金

jQuery检查日期是否有效 jQuery检查日期是否有效 Mar 01, 2025 am 08:51 AM

jQuery检查日期是否有效

10个jQuery手风琴选项卡 10个jQuery手风琴选项卡 Mar 01, 2025 am 01:34 AM

10个jQuery手风琴选项卡

10值得检查jQuery插件 10值得检查jQuery插件 Mar 01, 2025 am 01:29 AM

10值得检查jQuery插件

HTTP与节点和HTTP-Console调试 HTTP与节点和HTTP-Console调试 Mar 01, 2025 am 01:37 AM

HTTP与节点和HTTP-Console调试

自定义Google搜索API设置教程 自定义Google搜索API设置教程 Mar 04, 2025 am 01:06 AM

自定义Google搜索API设置教程

jQuery添加卷轴到Div jQuery添加卷轴到Div Mar 01, 2025 am 01:30 AM

jQuery添加卷轴到Div

See all articles