JavaScript 的async、await功能

async function#

async function 说明#

和C#中的使用类似。不过Task在Javascript中使用的是Promise对象。

async function 的返回值#

async function testAsyncFunction()
{
    // 返回字符串
    // 函数返回一个成功的Promise，内部value为字符串值
    // return 'abc';

    // 直接返回
    // 函数返回一个成功的Promise，内部value为undefined
    // return;

    // 抛出错误
    // 函数返回一个失败的Promise，内部value为错误信息
    // throw new Error('Error');

    // 返回一个Promise对象
    // 如果时返回的成功的Promise对象,内部value就是对应值
    // 如果时返回的失败的Promise对象,内部value就是对应值
    return new Promise((resolve,reject)=>{
        //成功值
        resolve("成功值");
        //失败值
        //reject("失败值");
    });

    // 总结：只要 没有抛出错误 或 返回失败的Promise 就是返回成功的Promise
}

let test = testAsyncFunction();

test.then(resolve=>{
    console.log(resolve);
},reason => {
    console.log(reason);
});

await#

说明#

await后面跟Promise类型的实例。
await表达式的值为后面Promise类型的实例的返回值。
使用async、await配合Promise的方式，处理错误的方式使用try...catch...。

基本使用#

//用于测试Promise对象
const panda = new Promise((resolve, reject)=>{
    //如果成功
    resolve('panda666');
    //如果出错
    reject('panda666');
});


//async function
async function main()
{
    try{
        //result的值为panda的返回值
        let result = await panda;
        console.log(result);
    }catch (e) //如果panda出错，进入异常处理
    {
        console.error(e);
    }
}

main();

实例#

依次读取文件#

import fs from  'fs';

let filePath1 = "C:/Users/admin/Downloads/test/file/t1.txt";
let filePath2 = "C:/Users/admin/Downloads/test/file/t2.txt";
let filePath3 = "C:/Users/admin/Downloads/test/file/t3.txt";

function readFile1()
{
    return new Promise((resolve, reject)=> {
        fs.readFile(filePath1,(error,data)=>{
            if(error)
            {
                reject(error);
            }

            resolve(data);
        });
    });
}

function readFile2()
{
    return new Promise((resolve, reject)=> {
        fs.readFile(filePath2,(error,data)=>{
            if(error)
            {
                reject(error);
            }

            resolve(data);
        });
    });
}

function readFile3()
{
    return new Promise((resolve, reject)=> {
        fs.readFile(filePath3,(error,data)=>{
            if(error)
            {
                reject(error);
            }

            resolve(data);
        });
    });
}

async function test()
{
    let r1 = await readFile1();
    let r2 = await readFile2();
    let r3 = await readFile3();

    console.log(r1.toString());
    console.log(r2.toString());
    console.log(r3.toString());
}



test()

发送ajax的get请求#

function sendAjaxGet(url)
{
    return new Promise((resolve, reject)=>{
        try{
            let xMLHttpRequest = new XMLHttpRequest()

            xMLHttpRequest.open('get',url);

            xMLHttpRequest.send();

            xMLHttpRequest.onreadystatechange = function (e)
            {
                if(xMLHttpRequest.readyState === 4)
                {
                    if(xMLHttpRequest.status < 300 && xMLHttpRequest.status >= 200)
                    {
                        resolve(xMLHttpRequest.response);
                    }
                    else
                    {
                        reject(xMLHttpRequest.status);
                    }
                }
            }
        }
        catch (e)
        {
            reject(e.message);
        }
    })

}


async function main()
{
    try
    {
        let result = await sendAjaxGet('/index2.html');
        console.log(result);
    }
    catch (e)
    {
        console.log(e);
    }
}

main()