async与await以及宏微任务

ゝ一纸荒年。 2022-12-20 05:59 98阅读 0赞

# async与await以及宏微任务 #

一个正在努力爱好运动的程序猿  
座右铭：越努力越幸运，越运动越健康，热爱编程，热爱运动。

--------------------

### 文章目录 ###

*  async与await以及宏微任务
 *  一、async与await
 *  二、宏微任务

--------------------

# 一、async与await #

async function f(){   //async函数返回的是一个promise对象
            return 'f'
        }
        //f(); //Promise {<resolved>: "f"}
        f().then(function(res){    //默认为成功的状态，将该函数的返回值传给then的参数
            console.log(res)
        })
    
        async function f(){   //async函数返回的是一个promise对象
            return '1234'
        }
        f().then(res=>{ 
            console.log(res)
        });
        console.log(1);
        // 1 1234
    
    
        // await
        // await操作符用于等待一个Promise对象，它只能在异步函数async function内部使用。
        // 返回值：
        // 返回promise对象的处理结果，如果待等的不是promise对象，则返回该值本身
        // 如果一个promise被传递给一个await操作符，await将等待promise正常处理完成并返回其处理结果
        function f2(){ 
            console.log(4)
        }
        async function f(){ 
            await f2();     
            console.log(2)   
        }
        f();
        console.log(3); 
    
        //正常情况下，await命令后面是一个promise对象，它也可以是其它值，如字符串，布尔值，数值以及普通函数。
        console.log(2)
        async function fn(){ 
            console.log(3)
            await 100;  
            console.log(1)
        }
        fn()
        console.log(4)
    
        //await命令后面是一个promise对象
        function p(){ 
            return new Promise(resolve=>{ 
                resolve();
                console.log(1)
            });
        };
        async function fn(){ 
            console.log(2)
            await p();  
            console.log(3)
        }
        fn()

# 二、宏微任务 #

//宏任务 setTimeout setInterval 
        //微任务 promise中的then async await
    
        //promise是同步还是异步？
        console.log(1);  //同步
        let a = new Promise((res,rej)=>{ 
            console.log(2)  //同步
        });
        console.log(3); //同步
        let a2 = new Promise((res,rej)=>{ 
            console.log(4)  //同步
        });
        console.log(5);   //同步
     
    
        console.log(1)   //同步
        let a = new Promise((res,rej) => {   
            res();
            console.log(2); //同步
        });
        a.then(() => {     //异步
            console.log(3)
        })
        console.log(4);  //同步
        let b = new Promise((res,rej) => {   
            res();
            console.log(5);  //同步
        });
        b.then(() => {   
            console.log(6) //异步
        })
        console.log(7);   //同步
    
    
        setTimeout(()=>{   //宏任务
            console.log(1)
        },0)
       new Promise((res,rej) => {   
            res();
            console.log(2);  //同步
        }).then(() => {   
            console.log(3) //微任务
        })
        console.log(4)  //同步
    
    
        async function f(){   //async函数返回的是一个promise对象
            console.log(5)  //同步
            return '1234'
        }
        f().then(res=>{    //微任务
            console.log(res)
        });
        console.log(1);   //同步