zoukankan      html  css  js  c++  java
  • demo_09 async&await

    // async位于函数字面量或函数表达式的前面(普通函数,立即执行函数,箭头函数均可),被修饰函数的返回一个Promise对象
    // 简化Promise的使用过程,让你的异步代码看起来像是同步的

    /*
    await一定要位于async函数内部
    await一般位于Promise对象之前,所以一般位于async函数执行的前面,但若是返回值为Promise对象的普通函数也可
    await会拿到该对象的结果,也就是then中resolve或reject的参数。如果不是Promise对象,则直接返回对应的值
    若await后方不是Promise对象,则会将其用Promise.resolve包装后执行
    await的执行会被强制等待至拿到结果,后续函数体内的代码执行被阻塞,函数本身不会阻塞整体代码
    */

    // 案例1:基本使用 *************************************
    /*

    // function chloe() {
    //     return new Promise((resolve, reject) => {
    //         console.log("chloe");
    //         resolve(20);
    //     });
    // }

    // 以上等价于:
    async function chloe() {
        console.log("chloe");
        return 20;
    }

    async function taran() {
        // chloe函数执行返回出一个Promise对象, await拿到该对象resolve的参数20, 赋值给age
        const age = await chloe();
        console.log("taran" + age);
    }

    taran();

    输出:
    chloe
    taran20

    */

    // 案例2: 掷色子,使用async和await获取成功的结果 *************************************
    /*

    // 下面这段代码async中使await 摇色子()先执行,等到三秒后执行完再把得到的结果赋值给左边的n,
    // 也就是说test函数需要三秒钟才执行完成,所以test函数是异步的,因此前面必须写async
    function 摇色子() {
        return new Promise((resolve, reject) => {
            let sino = parseInt(Math.random() * 6 + 1)
            setTimeout(() => {
                resolve(sino)
            }, 3000)
        })
    }
    async function test() {
        let n = await 摇色子()
        console.log(n)
    }

    test()

    输出:2

    */

    // 案例3: 获取失败的结果
    /*

    function 摇色子(猜测) {
        return new Promise((resolve, reject) => {
            let sino = parseInt(Math.random() * 6 + 1)
            if (sino > 3) {
                if (猜测 === '大') {
                    resolve(sino)
                } else {
                    reject(sino)
                }
            } else {
                if (猜测 === '大') {
                    reject(sino)
                } else {
                    resolve(sino)
                }
            }
            setTimeout(() => {
                resolve(sino)
            }, 300)
        })
    }
    async function test() {
        try {
            //把await及获取它的值的操作放在try里
            let n = await 摇色子('大')
            console.log('赢了' + n)
        } catch (error) {
            //失败的操作放在catch里
            console.log('输了' + error)
        }
    }

    test()
    // 输出: 输了2

    */

    // 案例4:
    /*

    function fn() {
        return new Promise(resolve => {
            console.log(1)
        })
    }
    async function f1() {
        await fn()  // 必须拿到resolve的值
        console.log(2)
    }

    f1()
    console.log(3)
        // 这个代码因为fn是属于同步的,所以先打印出1,然后是3,但是因为没有resolve结果,所以await拿不到值,因此不会打印2
        //1
        //3
    */

    // 案例5:
    function fn() {
        return new Promise(resolve => {
            console.log(1)
            resolve('哈哈')
        })
    }
    async function f1() {
        let msg = await fn() // await表示异步,所以会优先执行console.log(3)
        console.log(2)
        console.log(msg)
    }

    f1()
    console.log(3)
        // 这个代码与前面相比多了个resolve说明promise成功了,所以await能拿到结果,因此就是1 3 2
        // 1
        // 3
        // 2
        // 哈哈
  • 相关阅读:
    【redis源码】(三)Zipmap
    【redis源码】(五)Ziplist
    mint 13 安装 phpunit
    【php】nginx phpfpm “session锁”问题
    linux 系统下 恢复被误删文件
    【python】python相关的那些事【一】python 中的变量
    【redis源码】(八) Intset.c
    【python】【scrapy】使用方法概要(三)
    【redis源码】(六)Ae.c
    【c++】关于默认构造函数
  • 原文地址:https://www.cnblogs.com/luwei0915/p/13384843.html
Copyright © 2011-2022 走看看