zoukankan      html  css  js  c++  java
  • 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来执行下一步请求

  • 相关阅读:
    springboot 无法访问静态资源
    webrtc源码阅读理解一
    c++ include的顺序重要吗?
    简说yuv
    i420 转 nv21
    ffmpeg mp4 转 yuv、 y4m转yuv、mp4转y4m && ffplay 播放y4m、yuv
    mysql 查询json字符串条件
    Webpack4.X中sourcemap的配置 详解
    webpack如何打包生成的map文件不生效?
    vue中使用setInterval,移入暂停,移出继续
  • 原文地址:https://www.cnblogs.com/lisa2544/p/15665773.html
Copyright © 2011-2022 走看看