3.async函数详解——ES6异步编程

//async函数的基本语法
function getData(code){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            console.log(code);
        },1000)
    })
}

//async函数定义
/*
    async函数的await的返回值一定是一个promise对象
    async函数必须在前一个await的promise进入resolve状态的时候才会执行下一个await,自动往下执行
    async函数调用了以后,自动执行
*/
async function sedAjax(){
    //这里的返回值,就是上面resolve里传来的参数
    const res = await console.log('first');
    console.log(res);

    await console.log('second');
    await console.log('third');
    await console.log('fourth');
}
sedAjax();

eg.先获取商品详情,在获取商品评论

function getData(url){
    $.get(url,data=>{
        console.log(data);
        getData(`http://localhoset:3000${data.commentsUrl}`);
    },'json')
}

getData("http://localhoset:3000/goos_detail?id=2")


用async函数

function getData(url){
    
    return new Promise((resolve,reject)=>{
        $.get(url,data=>{
            console.log(data);
            resolve(`http://localhoset:3000${data.commentsUrl}`);
            //reject("未找到商品评论")
        },'json')
    });
}

async function getGoods(url){
    const commentsUrl = await getData("http://localhoset:3000/goos_detail?id=2");
    await getData(commentsUrl);
}

getGoods()

跟Generator函数的比较
1.await调用的函数必须返回的是Promise对象
2.async函数语法语义更加明确,async,await语义更准确;
3.async函数有内部的自动执行器,不用通过next来执行下一步请求

posted @ 2021-12-09 10:13  lisa2544  阅读(152)  评论(0编辑  收藏  举报