首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用async/await和then()如何将结果保存到数组中

使用async/await和then()可以将结果保存到数组中的方法如下:

  1. 使用async/await:
代码语言:txt
复制
async function fetchData() {
  const resultArray = [];
  try {
    const result1 = await asyncFunction1();
    resultArray.push(result1);
    const result2 = await asyncFunction2();
    resultArray.push(result2);
    const result3 = await asyncFunction3();
    resultArray.push(result3);
    // 继续添加需要获取结果的异步函数
  } catch (error) {
    console.error(error);
  }
  return resultArray;
}

fetchData().then((resultArray) => {
  console.log(resultArray);
}).catch((error) => {
  console.error(error);
});

在fetchData函数中,使用await关键字等待每个异步函数的结果,并将结果添加到resultArray数组中。最后,通过返回resultArray数组,可以在then()方法中获取到结果。

  1. 使用then():
代码语言:txt
复制
function fetchData() {
  const resultArray = [];
  return asyncFunction1()
    .then((result1) => {
      resultArray.push(result1);
      return asyncFunction2();
    })
    .then((result2) => {
      resultArray.push(result2);
      return asyncFunction3();
    })
    .then((result3) => {
      resultArray.push(result3);
      // 继续添加需要获取结果的异步函数
      return resultArray;
    })
    .catch((error) => {
      console.error(error);
    });
}

fetchData().then((resultArray) => {
  console.log(resultArray);
}).catch((error) => {
  console.error(error);
});

在fetchData函数中,通过使用then()方法链式调用每个异步函数,并将结果添加到resultArray数组中。最后,通过返回resultArray数组,可以在then()方法中获取到结果。

这两种方法都可以将异步函数的结果保存到数组中,以便后续处理或展示。

相关搜索:使用Async和await with Fetch (在Redux的操作中) ReactJS数组在Nodejs中使用async和await时不返回任何内容使用jest和supertest使用async/await测试Javascript中的DB插入如何在vuex中使用async和await中的action对象?无论使用Async和Await,Firebase中的对象数据都是未定义的如何将sql结果中的特定列保存到JSON数组中?如何将Google API结果保存到数组中并在其上添加新结果?如何使用JSON和Fetch/Async Await将数据从数组/对象添加到HTML下拉菜单使用async和await检查电子邮件是否已存在于Mongo Atlas DB中使用Sequilize和async/await以正确的顺序在Node.js中查找/创建记录使用for xml和查询提示将查询结果保存到变量中如何使用async/await编写.then函数,以便捕获来自axios的响应(在单独的文件和方法中,在vue中)在给定的外部JSON对象中使用async/await方法和vanilla js中的try和catch语句,使用json填充Select下拉列表使用xargs sed查找和替换 - 我可以将结果保存到文件中吗?numpy savetxt:如何将整数和浮点型numpy数组保存到文件的保存行中使用for循环中的dataframe和xlsxwriter将整个Beautifulsoup数组保存到excel中如何将来自用户的使用html input标签的输入保存到React JS中的"state“中的数组中。使用"mysql_fetch_row"从数据库中检索结果并使用PHP和mysqli插入到数组中?如何将Mysqli绑定结果中的一个放入数组中以使用in_array()函数进行匹配?如何将对象数组转换为元素数组,然后使用map和foreach方法将它们放在主div根元素中?
相关搜索:
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • Vue异步:Asyncawait使用

    bug收集:专门解决与收集bug的网站 最近,在写在项目中很多的地方,用到了asyncawait。...发现了理解的有些不一样, 下面有几道网上看到的题,大家可以做做,看看和你想的是否一样 async function test() { console.log(0) await console.log...//最后一个输出 } function test1(){ console.log(22) } test1(); test(); console.log(10); 输出结果: 总结:异步方法里面...函数的x形成了闭包,所以x = (await 2) + x相当于x = (await 2) + 1,所以最终输出:3 结论: 上面代码的关键是:test函数x的取值操作与x = 1这行代码执行顺序先后的问题...,所以我们可以得出一个结论:await会阻塞其所在表达式后续表达式的执行。

    30810

    asyncawait使用总结 ~ 竟然一直用错了c#asyncawait使用。。

    对于c#asyncawait使用,没想到我一直竟然都有一个错误。。 。。还是总结太少,这里记录下。 这里以做早餐为例 流程如下: 倒一杯咖啡。 加热平底锅,然后煎两个鸡蛋。 煎三片培根。...可以看出,这样编写的异步最初同步版本的总共的耗时大致相同。 这是因为这段代码还没有利用异步编程的某些关键功能。 即上面的异步代码的使用在这里是不准确的。...例如:首先启动鸡蛋培根。 同时启动任务 在很多方案,你可能都希望立即启动若干独立的任务。然后,在每个任务完成时,你可以继续 进行已经准备的其他工作。 就像这里同时启动煎鸡蛋,培根烤面包。...; } 高效的等待任务 可以通过使用Task类的方法改进上述代码末尾一系列await语句。...总结: async await的功能最好能做到: 尽可能启动任务,不要在等待任务完成时造成阻塞。 即可以先把任务存储到task,然后在后面需要用的时候,调用await task()方法。

    1.8K10

    使用Puppeteer爬取地图上的用户评价评论

    然后,使用Puppeteer打开目标网站的地图页面,并输入要搜索的地点或商家名称。接着,使用Puppeteer获取搜索结果的第一个条目,并点击进入详情页面。...最后,使用Puppeteer获取详情页面的用户评价评论,并保存到本地文件或数据库。正文下面我们将详细介绍使用Puppeteer爬取地图上的用户评价评论的具体步骤代码。1....获取详情页面的用户评价评论最后,我们需要获取详情页面的用户评价评论,并保存到本地文件或数据库。...page.waitForSelector('.se-bn-list'); // 获取搜索结果的第一个条目的标题链接 const firstResult = await page.evaluate...我们成功地从百度地图上爬取了北京饭店的用户评价评论,并打印到了控制台中。我们可以根据自己的需要,将这些数据保存到本地文件或数据库,以便后续分析使用

    37420

    只需百十行代码,为你的Web页面增加本地文件操作能力,确定不试试吗?

    笔者开源了一个Web思维导图mind-map,数据默认是存储在localstorage里,如果想保存到本地文件,需要使用导出功能,下次打开再使用导入功能,编辑完如果又想保存到文件,那么又需要从重新导出覆盖原来的文件...打开 先来看看打开文件,调用的是showSaveFilePicker方法,返回一个Promise,选择文件成功了那么Promise的结果是一个数组,每一项代表一个文件的操作句柄: 图片 如果要获取某个文件的内容或写入某个文件就需要通过这些文件句柄对象...async openLocalFile() { try { let [ _fileHandle ] = await window.showOpenFilePicker({...写入流默认是空的,每调用一次write方法,都会在.crswap追加内容,但是可以指定写入的位置: await writable.write({ type: "write", position: 0,...创建成功返回的也是一个文件句柄,那么创建文件就很简单了: async createLocalFile(content) { try { let _fileHandle = await

    73110

    React 必会的 10 个概念

    介绍了基本语法,让我们了解如何将箭头函数与 React 一起使用。除了如上所述定义 React 组件之外,箭头函数在操作数组以及使用异步回调和 Promise 时也非常有用。...如果您需要了解 Promise,请查看 MDN 的详细讲解。 您可能已经注意到,有两个新关键字:async await。 让我们首先从 async 关键字开始。...异步用于定义异步函数,该函数返回隐式 Promise 作为其结果。 ? 请注意,使用异步函数的代码的语法结构看起来像常规同步函数。 关键字 await仅在异步函数起作用。...值得一提的是 async / await 是如何处理错误。实际上,如果一个 Promise 能够正常 resolve,它就会返回结果。但是,如果 reject,则会引发错误。...在 React ,这就是我们可以使用 promises + async / await 做到的。 ? 展开运算符 / 不定参数 展开运算符不定参数由三个点表示...。

    6.6K30

    win10 uwp 如何将像素数组转 png 文件

    堆栈的小伙伴好奇他有一个数组数组里面是 BGRA 的像素,他需要将这个数组转换为 PNG 文件 在 UWP 可以使用 BitmapEncoder 将像素数组加密为文件 在使用 BitmapEncoder...因为存放像素数组使用的是一维的数组,如果不知道图片宽度,那么就不知道这个图片的像素是对应数组哪个 通过下面方法可以转换像素数组到文件 private async Task ByteToPng...) { } } 这里的 IRandomAccessStream 就是 StorageFile 打开文件 private async...file.OpenStreamForWriteAsync()).AsRandomAccessStream()) { await ByteToPng...(byteList, width, height, stream); } } 通过这个方法,可以传入数组图片的宽度高度,保存的文件,就可以将像素数组存到 png

    1.5K30

    如何优雅的不用try-catch捕获await的错误

    在日常开发,通常我们会用 promise 的形式来进行一些异步的操作,但是为了更方便,我们也会较多的使用语法糖 async await 的形式,但是这两者有个区别,promise 可以使用 .catch...来捕获问题,但是 async await 却只能使用 try catch 来捕获,这样写起来很不友好,代码充斥着大量的 try catch,类似这种 (async () => { try {...既然刚才提到了 await 是 promise 的语法糖,那我们用 promise 方式来捕获就可以了吧,于是有了下面的代码 (async () => { const data = await getList...没有错误的话就返回了对应的数据,但是每个方法要搞这么一手,也挺麻烦的,而且最重要的错误信息没有同步的返回,需要在每个代码逻辑里面都进行处理 针对上面的问题,我们再优化一下,把错误信息也同步的返回,这里使用数组的形式去接受数据...其实有一个 await-to-js 的库,是专门做这个操作的,我看了一下源码,非常简单,就拿过来直接看吧,思想都是一样的,源码很短,只有 23 行,其中还包括注释空行,主要的思想跟之前我们的思路都是一样的

    37510

    AsyncAwait 如何通过同步的方式实现异步?

    await 只能在 async 函数中使用,可以把 async 看成将函数返回值使用 Promise.resolve() 包裹了下。...async await 相比直接使用 Promise 来说,优势在于处理 then 的调用链,能够更清晰准确的写出代码。...其实我们平时已经在大量使用了,那就是 callback,实现异步的核心就是回调钩子,将 cb 作为参数传递给异步执行函数,当有了结果后在触发 cb。...一个单向链表包含两个值: 当前节点的值一个指向下一个节点的链接 单链特点:节点的链接方向是单向的;相对于数组来说,单链表的的随机访问速度较慢,但是单链表删除/添加数据的效率很高。...、类数组的对象、Set Map): 当一个对象需要被迭代的时候(比如开始用于一个 for..of 循环中),它的 @@iterator 方法被调用并且无参数,然后返回一个用于在迭代获得值的迭代器

    3.3K50

    上天的Node.js之爬虫篇 15行代码爬取京东淘宝资源 【深入浅出】

    () => { //使用async函数完美异步 const browser = await puppeteer.launch(); //打开新的浏览器 const page =...潇洒入世 -逍遥天境篇 上面只爬取了京东首页的图片内容,假设我的需求进一步扩大,需要爬取京东首页 的所有 标签对应的跳转网页的所有 title的文字内容,最后放到一个数组。...page.evaluate 这个函数,内部是处理我们进入想要爬取网页的数据逻辑 page.goto page.evaluate两个方法,可以在async内部调用多次, 那意味着我们可以先进入京东网页...return $('title').text(); //返回每个界面的title文字内容 }); arr.push(result) //每次循环给数组添加对应的值...} console.log(arr) //得到对应的数据 可以通过Node.js的 fs 模块保存到本地 await browser.close() })() 上面有天坑

    2.1K30

    看过这么多爆文,依旧走不好异步编程这条路?​

    async/await引起的死锁现场 UI程序(WinForm、WPF):点击按钮,触发一个HTTP请求,用请求结果修改UI控件,以下代码会引发deadlock public static async...本文会解释: async/await工作机制 SynchronizationContext在异步编程语法糖的意义 示例代码为什么会deadlock 1....大家都知道:WinFormWPF都有类似的原则:长耗时的任务在后台进行,将异步结果返回给UI线程 。(这难道就是ConfigureAwait方法默认传true的原因?)...因此,对于ASP.NET Core程序,ConfigureAwait(false)不是必需的,然而,在基础库时最好还是使用ConfigureAwait(false),因为你不准上层会混用同步/异步代码...总结 微软为加快开发效率上着实费了心力,.NET提供的await/async语法糖简化了异步编程方式, 在异步编程,SynchronizationContext决定了后继代码在哪里执行的环境,深入理解这个对象的背景不同框架的实现方式

    84220

    这些js手写题你能回答上来几道

    ,要求去除数组的重复数字并且返回新的无重复数组。...后面的字符串取出来 const paramsArr = paramsStr.split('&'); // 将字符串以 & 分割后存到数组 let paramsObj = {}; // 将 params...,并将两个字符串转化为数组,以便进行每一位的加法运算将两个数组的对应的位进行相加,两个数相加的结果可能大于10,所以可能要仅为,对10进行取余操作,将结果保存在当前位判断当前位是否大于9,也就是是否会进位...async await方式来使用(async () => { class HttpRequestUtil { async get(url) { const res...green') await task(2100, 'yellow') taskRunner()}taskRunner()event模块实现node回调函数的机制,node回调函数其实是内部使用了观察者模式

    47330

    使用Puppeteer构建博客内容的自动标签生成器

    获取首页上所有博客文章的链接,并保存到一个数组。遍历数组的每个链接,打开对应的博客文章页面,并获取文章的标题正文内容。...获取首页上所有博客文章的链接,并保存到一个数组打开目标博客网站的首页后,我们可以使用page.$$eval()方法来获取首页上所有博客文章的链接,并保存到一个数组。...然后,我们可以使用page.$eval()方法来获取文章的标题正文内容,并保存到一个对象。...,并等待页面加载完成 await page.goto(link, {waitUntil: 'networkidle2'}); // 获取文章的标题正文内容,并保存到一个对象 const post...将文章的链接、标题、正文内容标签保存到数据库获取到所有博客文章的链接、标题、正文内容标签后,我们可以将它们保存到数据库,以便后续的使用分析。

    24610
    领券