Learn how to write a promise based delay function and then use it in async await to see how much it simplifies code over setTimeout.

Lets say you want to call a function after 1s, 2s, 3s. You can use setTimeout, or you can wrap it up into a simple delay function that works with async/await

We want to conver this code

const run = (cb) => {
setTimeout(() => {
cb('1s');
setTimeout(() => {
cb('2s');
setTimeout(() => {
cb('3s');
}, 1000);
}, 1000);
}, 1000);
}

to:

const delay = (ms) => new Promise(res => setTimeout(res, ms));

const runAsync = async (cb) => {
await delay(1000);
cb('1s');
await delay(1000);
cb('2s');
await delay(1000);
cb('3s');
} runAsync((time) => console.log(time));

[TypeScript] Simplify asynchronous callback functions using async/await的更多相关文章

  1. Callback, Promise和Async/Await的对比

    Callback, Promise和Async/Await的对比 Callback Hell getData1(function (data1) { console.log('我得到data1了') ...

  2. [Typescript] Promise based delay function using async / await

    Learn how to write a promise based delay function and then use it in async await to see how much it ...

  3. [微信小程序] 终于可以愉快的使用 async/await 啦

    [小程序] 终于可以愉快的使用 async/await 啦 这篇文章主要是想说一下 怎么在微信小程序中使用async/await从而逃离回调地狱 背景 最近一直在搞微信小程序 用的语言是TypeScr ...

  4. 【TypeScript】如何在TypeScript中使用async/await,让你的代码更像C#。

    [TypeScript]如何在TypeScript中使用async/await,让你的代码更像C#. async/await 提到这个东西,大家应该都很熟悉.最出名的可能就是C#中的,但也有其它语言也 ...

  5. Async/Await - Best Practices in Asynchronous Programming z

    These days there’s a wealth of information about the new async and await support in the Microsoft .N ...

  6. 从C#到TypeScript - async await

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  7. callback vs async.js vs promise vs async / await

    需求: A.依次读取 A|B|C 三个文件,如果有失败,则立即终止. B.同时读取 A|B|C 三个文件,如果有失败,则立即终止. 一.callback 需求A: let read = functio ...

  8. js中promise解决callback回调地狱以及使用async+await异步处理的方法

    1.callback回调地狱 function ajax(fn) { setTimeout(()=> { console.log('你好') fn() }, 1000) } ajax(() =& ...

  9. 使用async/await消除callback hell

    使用async/await消除callback hell 通过Future回调中再返回Future的方式虽然能避免层层嵌套,但是还是有一层回调,有没有一种方式能够让我们可以像写同步代码那样来执行异步任 ...

随机推荐

  1. call、apply、bind 区别

    1.为什么要用 call .apply? 为了 改变方法里面的属性而不去改变原来的方法 function fruits() {} fruits.prototype = { color: "r ...

  2. 几个经常使用的cmd命令

    compmgmt.msc 计算机管理  devmgmt.msc 设备管理器  diskmgmt.msc 磁盘管理工具  dfrg.msc 磁盘碎片整理  eventvwr.msc 事件查看器  fsm ...

  3. Android学习笔记之ViewFlipper

    <1>被添加到ViewFlipper中的两个或两个以上的视图之间将执行一个简单的ViewAnimator动画.一次仅能显示一个子视图.如果需要,可以设置间隔时间使子视图像幻灯片一样自动显示 ...

  4. ios系统和某些移动端background-attachment:fixed不兼容性

    固定背景不动:background-attachment:fixed; ios系统和某些移动端background-attachment:fixed不兼容性,没有任何效果,但可以hack一下就可以了, ...

  5. input表单验证(全面)

    1.英文字母 1 <script type="text/javascript"> 2 //验证只能是字母 3 function checkZm(zm){ 4 var z ...

  6. 【2017 Multi-University Training Contest - Team 10 】Monkeys

    [链接]点击打开链接 [题意] 给你一棵n节点的树,现在让你放k个猴子,可以删边,问最少可以剩余几条边,放k个猴子,满足任意一个猴 子至少与一只猴子相连.2<=k<=n<=1e5 [ ...

  7. node的express参数获取

    1.express中的不定向路由参数的获取 如: app.get('/profile/:id', function(req, res) { var id=req.params.id res.send( ...

  8. UIDeviceOrientationDidChangeNotification和UIApplicationDidChangeStatusBarFrameNotification

    这几天做App的时候,需要添加旋转屏通知以便调整UI布局 刚开始我使用的是UIDeviceOrientationDidChangeNotification, 一直有一些问题就是,如果使用这个通知,当i ...

  9. vue项目实现导出数据到excel

    实现导出功能分两种,一种是客户端拿到数据做导出,第二种是服务器端处理好,返回一个数据流实现导出 第一种网上很容易找到,也很好用,本文要说的是第二种. fetchExport({ id: this.so ...

  10. [Angular] Implementing A General Communication Mechanism For Directive Interaction

    We have modal implement and now we want to implement close functionality. Becuase we use a structure ...