async、await和.then的使用

最新推荐文章于 2025-03-31 19:46:45 发布
最新推荐文章于 2025-03-31 19:46:45 发布
阅读量1.9k 收藏 9
点赞数 8
CC 4.0 BY-SA版权
分类专栏： 前端找工作之路 文章标签： async await
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_64715294/article/details/135308495
本文介绍了JavaScript中的Promise、.then和.catch在处理异步操作中的作用，以及async和await作为语法糖如何提高代码清晰度和避免回调地狱。重点讲解了如何在async函数中使用await表达式以实现更简洁的异步编程。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

.then async await 三者

  • Promise虽然解决了回调地狱问题，但是缺点是有不少的样板代码，并且写代码时候还是通过then注册回调方式。

.then

  • Promise对象自带 ，用于处理异步操作的成功结果。
    .then 和 .catch 函数来传入一个执行 success 和 fail 的回调。可以多个.then执行，但如果 .then 里有异步操作，需在 .then 里 return 该 Promise才能使得当前then链式调用，以处理多个异步操作的结果。
  • async、await是语法糖，优势在于处理 then 的调用链，代码更清晰、明确，避免了写一大堆 then，在调接口的时候多用async、await。
const submitForm = () => {
   
   
    newsFormRef.value.validate(
最低0.47元/天 解锁文章

200万优质内容无限畅学
async await使用规范记录
luobo2345的博客
05-15 1485
await和then不要一起使用，await可以通过try catch捕获返回信息。
vue3 使用async await
10-31
vue3 使用async await
js中两种异步方式：async+await以及then
zhourongxiang1的博客
09-18 674
【代码】js中两种异步方式：async+await以及then。
同步、异步、Promise、then、async/await
最新发布
shw384348082的博客
03-31 1184
演进历程：回调 → Promise → async/await关系Promise是async/await的基础async函数返回Promiseawait等待Promise解决最佳实践简单异步操作可直接使用Promise复杂异步流程推荐async/await并行无依赖任务使用Promise.all始终处理错误（.catch或try/catch）注意事项避免在循环中错误使用await合理使用Promise缓存避免重复请求在Node.js中注意Promise的内存泄漏问题。
JavaScript Promise 对象的语法 async await 和.then
tenc1239的博客
07-16 1024
3 用 async await .then ,非要在.then外再处理数据执行操作 就要async await。2 用 async await -> 等待结果后 在继续下面的操作处理数据。1 只用.then , 只能在.then中完成所有操作。
2020-10-07
weixin_46311363的博客
10-07 433
async和await await后面接一个会return new promise的函数并执行它 await只能放在async函数里 使用async和await获取成功的结果 function 摇色子(){ return new Promise((resolve, reject)=>{ let sino = parseInt(Math.random() * 6 +1) setTimeout(()=>{ resolve(sino) },3000) }) } async function test(
async await .then
qq_37757277的博客
10-30 820
Promise 是 JavaScript 中用于处理异步操作的对象。Promise 提供了一种更清晰和结构化的方式来处理异步代码，避免了传统回调函数的复杂性（即“回调地狱”）。它们都基于 JavaScript 的 Promise 对象，但提供了不同的语法和使用体验。通过理解和选择合适的异步处理方式，你可以编写更高效和可维护的 JavaScript代码。是 Promise 对象的方法，用于在 Promise解决后执行回调函数。Promise 是现代 JavaScript 中处理异步操作的基础，它为。
promise .then和async await的使用
m0_64207574的博客
03-01 7928
Promise .then和async await的使用
async/await用法详解
终生学习，终生成长
04-29 2565
* `await`命令只能用在`async`函数之中，如果用在普通函数中会报错。 * `async`函数体内，`await`命令之前的代码以及`await`命令所在语句中`await`后的代码都为正常的同步代码，在`async`函数调用时正常执行。 * `async`函数会返回一个`Promise`对象。若返回的不是一个显式的`Promise`对象，则会使用`Promise.resolve()`包装成`Promise`对象。 * `await`命令后跟一条返回`Promise`对象的语句。若语句返回的
async await和.then的区别
09-15
async/await和.then都是用于处理异步操作的方法，但它们之间有一些区别。 1. 语法：async/await使用更简洁，更易读。它使用异步函数(async function)和await关键字来实现。而.then使用Promise的链式调用语法来处理...
前端请求成功之后获取response headers中的参数 async await 或者 .then()形式获取到
09-26
无论是使用async/await还是`.then()`链式调用，处理响应头（headers）的方式是一致的。 **使用async/await:** ```javascript async function fetchData(url) { const response = await fetch(url); if (response....
promise，async →await，then→catch，try→catch 使用简介
weixin_44434938的博客
03-13 1483
promise，async →await，then→catch，try→catch 使用简介
.then写法和async await 有啥区别?
画龍丶的博客
09-13 5921
最直观的讲一下有啥区别 场景: 三个接口 接口二用到接口一返回的数据 接口三用到接口二和接口一返回的数据 解决方法: promise + .then 写法 const makeRequest = () => { return promise1() .then(value1 => { return promise2(value1) .then(value2 => { return promise3(value1, v
详解async/await —— 从入门到实现原理
m0_65789515的博客
12-22 1018
通过前后对比，我们可以发现，在需要异步任务按照顺序严格执行的情况下，async/await可以避免嵌套过多的情况，取而代之的是简单易懂的同步形式代码。
async/await - 7.结合await和任意兼容.then()的代码
m0_37068028的博客
11-11 3540
async/await - 7.结合await和任意兼容.then()的代码async function main() { const number = await 888 console.log(number) // 888 } main() // 888await 888会调用const number = await Promise.resolve(888) await 后如果不是Pro
then里面调用 await
weixin_69811594的博客
12-24 1224
then里面调用 await
await和.then同时使用报错的问题
qq_37827020的博客
11-16 2270
await和.then同时使用报错的问题
关于 async 函数的理解
weixin_33843947的博客
12-11 234
前言 写这一篇文章的目的在于看到这篇文章觉得挺有意思，所以写下这个已表看法。 这个是原文 开始进坑 所谓的争论起源于一道面试题 async function async1() { console.log('async1 start') await async2() console.log('async1 end') } async function async2() { co...
async&await用法
aa_mmnn的博客
03-19 230
1、Why async&await 简单的一张图可以直观的表现出 callback、promise 和 async/await 在使用时的主要区别。 可以很明显的看到，callback 来控制异步的方式虽然非常简单，但也过于原始。在实际的使用中代码的逻辑顺序和业务的顺序是不相同的，错误控制基本靠手动检查err参数。 而到了 Promise 中这种情况好了很多，通过链式调用，Promise 可以直接在 then 中返回一个新的 Promise 来将异步操作串联起来，也有了统一的 catch
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

守灯者

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值