js 处理异步 callback、Promise、async+await三种方式

灰太狼 2022-02-27 15:06 233阅读 0赞

> **关于javascript处理异步的三种方式的简单介绍**

// 1、很久以前处理异步
    // callback 回调方式
    function ajax(fn) {
        setTimeout(() => {
            console.log('异步')
            fn()
        }, 1000)
    }
    ajax(() => {
        console.log('异步结束')
    })
    // 但是 如果请求多的话
    // 会出现回调地狱
    ajax(() => {
        console.log('第一个异步处理结束')
        ajax(() => {
            console.log('第二个异步处理结束')
            ajax(() => {
                console.log('第三个异步执行结束')
            })
        })
    })
    
    // 2、es6 Promise方法
    function delay(word) {
        return new Promise((resolve, reject)=> {
            setTimeout(() => {
                resolve(word)
            }, 2000)
        })
    }
    // 使用promise
    delay('老大')
        .then(res => {
            console.log(res)
            return delay('老二')
        })
        .then(res => {
            console.log(res)
            return delay('老三')
        })
        .then(res => {
            console.log(res)
        })
    
    
    // delay方法不变
    // 使用 async + await  ！！！ async一定要和await一起使用
    async function start() {
        // await 必须在async内部使用  等待一个异步
        const wrod1 = await delay('佟丽娅')
        console.log(wrod1)
        const wrod2 = await delay('郭德纲')
        console.log(wrod2)
        const wrod3 = await delay('岳云鹏')
        console.log(wrod3)
    }
    start()

可以复制下来直接用Node运行看结果

发表评论取消回复

表情：

评论列表（有 0 条评论，233人围观）

还没有评论，来说两句吧...

相关阅读

相关 Spring 异常处理三种方式

Spring 异常处理三种方式 1. 异常处理方式一. @ExceptionHandler 2. 异常处理方式二. 实现HandlerExceptionResolve

亦凉/ 2023年10月02日 16:36/ 0 赞/ 38 阅读

相关【js】js三种引用方式

1.js js是JavaScript的简写，但是跟JAVA没有任何关系。js是一种结实型的语言 js是运行在浏览器端的脚本语言，它的作用就是负责网页和用户的交互效果

刺骨的言语ヽ痛彻心扉/ 2022年11月26日 08:53/ 0 赞/ 274 阅读

相关异步处理方式探索

这里写自定义目录标题最佳异步处理方式探索 CompletableFuture ThreadPoolTaskExecutor

怼烎@/ 2022年10月17日 04:24/ 0 赞/ 237 阅读

相关 SpringMVC异常处理三种方式

1. SpringMVC异常处理在SpringMVC框架中，异常的处理分为预期异常和运行时异常，预期异常通过需要通过捕获来获取异常信息，运行时异常就靠我们程序员进行

左手的ㄟ右手/ 2022年04月04日 07:54/ 0 赞/ 247 阅读

相关 js异步加载的三种方式

1.defer异步加载，要等到dom文档全部解析完才会执行。只有ie9以下可以用，特点是也可以将代码写到内部。 <script type='text/javascri

雨点打透心脏的1/2处/ 2022年03月09日 14:18/ 0 赞/ 416 阅读

相关导入js的三种方式

文章目录 1 行内导入方式（不推荐，不安全） 2 内嵌式 3 外链式 4 注意点 1 行内导入方式（不推荐，不安

淡淡的烟草味﹌/ 2022年03月06日 09:48/ 0 赞/ 585 阅读

相关 js 处理异步 callback、Promise、async+await三种方式

> 关于javascript处理异步的三种方式的简单介绍 // 1、很久以前处理异步 // callback 回调方式 function ajax(f

灰太狼/ 2022年02月27日 15:06/ 0 赞/ 234 阅读

相关 vue.js三种安装方式

Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的

Myth丶恋晨/ 2021年10月30日 05:20/ 0 赞/ 421 阅读

相关 vue.js 三种方式安装

Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数

末蓝、/ 2021年09月14日 12:18/ 0 赞/ 463 阅读

相关 vue.js三种安装方式

vue.js三种安装方式 Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 A...

朱雀/ 2020年07月01日 19:43/ 0 赞/ 870 阅读