• async与await

    async与await

    1、async函数

    1. 函数的返回值为promise对象；

    2. promise对象的结果由async函数执行的返回值决定；

      • 如果返回值是一个非Promise类型的数据，那结果就是成功的promise对象
        async function main() {
    //1、如果返回值是一个非Promise类型的数据，那结果就是成功的promise对象
    //     return 521
 
    }
    const result = main();
    console.log(result);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    在这里插入图片描述

    • 如果返回的是一个Promise对象，return的结果决定函数的返回状态
        async function main() {
    //    2、如果返回的是一个Promise对象，return的结果决定main函数的返回状态
    	   return new Promise((resolve, reject)=>{
    	   //resolve("ok");
           reject("err")
        })

    }
    const result = main();
    console.log(result);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    在这里插入图片描述

    • 抛出异常，返回的结果就是抛出的值
    async function main() {
    //3、抛出异常，返回的结果就是抛出的值
        throw "Oh NO"
    }
    const result = main();
    console.log(result);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    在这里插入图片描述

    2、await表达式

    1. await右侧的表达式一般为promise对象，也可以是其他的值
    2. 如果表达式是promise对象，await返回的是promise成功的值
    3. 如果表达式是其他值，直接将次作为await的返回值

    注意：

    • await必须写在async函数中，但是async函数中可以没有await；
    • 如果await的promise失败了，就抛出异常，需要通过try..catch捕获处理
        async function main() {
        //1、右侧为promise的情况
        const pro1 = new Promise((resolve, reject) => {
            resolve("ok")
        });
        const result1 = await pro1;
        console.log(result1);//ok
        //    2、右侧为其他类型的数据
        const result2 = await 20;
        console.log(result2);//20
        //    3、如果promise是失败的状态
        const pro2 = new Promise((resolve, reject) => {
            reject("error")
        })
        try {
            const result3 = await pro2;
        } catch (err) {
            console.log(err);//error
        }
    }

    main();

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22

    在这里插入图片描述

    3、async函数与await的结合实践

    const fs = require("fs");
const util=require("util");
const readFile=util.promisify(fs.readFile)

async function main(){
//    读取第一个文件的内容
    try {
        const data1=await readFile("./resource/1-async1.txt");
        const data2=await readFile("./resource/2-async.txt");
        const data3=await readFile("./resource/3-async.txt");
        console.log(data1, data2, data3);
    }catch (err){
        console.log(err);
    }
}
main()

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16

    结合ajax请求：

    <body>
<button id="btn">点击获取一段名言</button>
<script src="../js/ajax.js"></script>
<script type="text/javascript">
   
    const btn = document.querySelector("#btn");
    btn.addEventListener("click", async () => {
        try {
            const result = await sendAjax();
            console.log(result);
        } catch (err) {
            console.log(err);
        }
    }, false);

    function sendAjax() {
        return new Promise((resolve, reject) => {
            $.ajax({
                url: "https://api.apiopen.top/api/sentences",
            }).then(res => {
                resolve(res);
            }).catch(err => {
                reject(err)
            })
        })
    }

</script>
</body>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29

    在这里插入图片描述

  • 相关阅读:
    第5章 验证码识别
    npm介绍、常用命令详解以及什么是全局目录
    Springboot常用参数注解
    u盘被格式化了文件还可以恢复吗?
    想要搭建网站帮助中心，看这一篇指南就对了！
    算法通关村第六关-青铜挑战树
    centos 6.10 安装 svn1.14.2
    数据结构——栈和队列
    MindSpore：强化学习基础-蒙特卡洛(Monte Carlo)
    汽车电子常用外围硬件电路设计
  • 原文地址：https://blog.csdn.net/fangqi20170515/article/details/126856069