一种通过async/await实现函数同步执行的方式

 1 const testArr = [
 2   () => {
 3     return new Promise((resolve, reject) => {
 4       setTimeout(()=> {
 5         alert(1);
 6         resolve();
 7       }, 300);
 8     });
 9   },
10   () => {
11     return new Promise((resolve, reject) => {
12       setTimeout(()=> {
13         alert(2);
14         resolve();
15       }, 500);
16     });
17   },
18   () => {
19     return new Promise((resolve, reject) => {
20       setTimeout(()=> {
21         alert(3);
22         resolve();
23       }, 100);
24     });
25   }
26 ];
27
28 async function iterate(arr) {
29   let index = 0;
30   while (index < arr.length - 1) {
31     await arr[index]();
32     index += 1;
33   }
34   return arr[index]();
35 }
36
37 iterate(testArr);

建议在https://codepen.io/pen上执行查看,挂载https://cdn.bootcss.com/babel-polyfill/7.0.0-alpha.12/polyfill.js

若您嫌麻烦,直接点这里: https://codepen.io/timrchen/pen/NggaEj

时间: 2024-07-31 00:41:13

一种通过async/await实现函数同步执行的方式的相关文章

js使用generator函数同步执行ajax任务

function request(url, callback) {   fetch(url, {mode: 'cors', credentials: 'include', headers: new Headers({ 'X-Requested-With': 'XMLHttpRequest' })})   .then(response => response.text())   .then(text => {     console.log(url);     console.log(text)

现代JS中的流程控制:详解Callbacks 、Promises 、Async/Await

JavaScript经常声称是_异步_.那是什么意思?它如何影响发展?近年来这种方法有何变化? 请思考以下代码: result1 = doSomething1(); result2 = doSomething2(result1); 大多数语言都处理每一行同步.第一行运行并返回结果.第二行在第一行完成后运行无论需要多长时间. 单线程处理 JavaScript在单个处理线程上运行.在浏览器选项卡中执行时,其他所有内容都会停止,因为在并行线程上不会发生对页面DOM的更改;将一个线程重定向到另一个URL

C#多线程和异步——Task和async/await详解

阅读目录 一.什么是异步 二.Task介绍 1 Task创建和运行 2 Task的阻塞方法(Wait/WaitAll/WaitAny) 3 Task的延续操作(WhenAny/WhenAll/ContinueWith) 4 Task的任务取消(CancellationTokenSource) 三.异步方法(async/await) 回到顶部 一.什么是异步 同步和异步主要用于修饰方法.当一个方法被调用时,调用者需要等待该方法执行完毕并返回才能继续执行,我们称这个方法是同步方法:当一个方法被调用时

Task和async/await详解

一.什么是异步 同步和异步主要用于修饰方法.当一个方法被调用时,调用者需要等待该方法执行完毕并返回才能继续执行,我们称这个方法是同步方法:当一个方法被调用时立即返回,并获取一个线程执行该方法内部的业务,调用者不用等待该方法执行完毕,我们称这个方法为异步方法. 异步的好处在于非阻塞(调用线程不会暂停执行去等待子线程完成),因此我们把一些不需要立即使用结果.较耗时的任务设为异步执行,可以提高程序的运行效率.net4.0在ThreadPool的基础上推出了Task类,微软极力推荐使用Task来执行异步

C# 彻底搞懂async/await

前言 Talk is cheap, Show you the code first! private void button1_Click(object sender, EventArgs e) { Console.WriteLine("111 balabala. My Thread ID is :" + Thread.CurrentThread.ManagedThreadId); AsyncMethod(); Console.WriteLine("222 balabala.

ES6 Async/Await 完爆Promise的6个原因

自从Node的7.6版本,已经默认支持async/await特性了.如果你还没有使用过他,或者对他的用法不太了解,这篇文章会告诉你为什么这个特性"不容错过".本文辅以大量实例,相信你能很轻松的看懂,并了解Javascript处理异步的一大杀器. 文章灵感和内容借鉴了6 Reasons Why JavaScript's Async/Await Blows Promises Away (Tutorial),英文好的同学可以直接戳原版参考. 初识Async/await 对于还不了解Async

js callback promise async await 几种异步函数处理方式

***callback  这个是最常用的也是最简单的 ,比如在ajax网络请求中,返回请求完成返回的数据 回调函数就是把一个函数当成另一个函数的参数,可以传递函数内的局部变量,也可以异步完成一些操作,在函数的实现里调用回调函数,在函数的调用里实现回调函数 // 回調函數的方式 閉包 可以獲取函數內部的局部變量 function testCallback(callback) { let a = 1; let b = 2; if (a < b) { callback && callbac

微信小程序捕获async/await函数异常实践

背景 我们的小程序项目的构建是与web项目保持一致的,完全使用webpack的生态来构建,没有使用小程序自带的构建功能,那么就需要我们配置代码转换的babel插件如Promise.Proxy等:另外,项目中涉及到异步的功能我们统一使用async/await来处理.我们知道,小程序的onError 生命周期只能捕获同步错误,而完全不采用小程序自带构建工具的情况下,开发模式下遇到的问题: 小程序异步代码中的异常onError无法捕获,开发者工具控制台也没有抛出异常信息 这样在开发过程中页面展示异常,

JavaScript ES7 中使用 async/await 解决回调函数嵌套问题

原文链接:http://aisk.me/using-async-await-to-avoid-callback-hell/ JavaScript 中最蛋疼的事情莫过于回调函数嵌套问题.以往在浏览器中,因为与服务器通讯是一种比较昂贵的操作,因此比较复杂的业务逻辑往往都放在服务器端,前端 JavaScript 只需要少数几次 AJAX 请求就可拿到全部数据. 但是到了 webapp 风行的时代,前端业务逻辑越来越复杂,往往几个 AJAX 请求之间互有依赖,有些请求依赖前面请求的数据,有些请求需要并行