Async和Await

async&await是Promise和Generator的语法糖

async

  • 可以作用在任何方法前, 返回值是一个Promise对象(回调函数也可以使用async)

  • 函数内部return的返回值, 会成为then回调函数的参数

  • async作用的方法,如果内部出现报错,可以被promise的catch方法捕获

  • 常规使用,一般都会通过try catch进行有可能报错的代码处理

Async和Await

 

await

  • await只能作用在async修饰的方法中,不能单独使用,如果使用报错:await is only valid in async functions and the top level bodies of modules
  • await是会阻塞代码执行
  • 正常情况 await后面跟着一个Promise对象; 返回的是Promise对象的成功后结果; 如果是一个普通值,那么会直接返回这个值
  • reject的返回 await没有办法进行捕获(使用try catch进行捕获
     

回调地狱

  •  简单说,就是函数作为参数层层嵌套

  • 在使用JavaScript时,为了实现某些逻辑经常会写出层层嵌套的回调函数,如果嵌套过多,会极大影响代码可读性和逻辑,这种情况也被成为回调地狱

如何解决回调地狱

1、Promise

Promise是什么

        function fn(str){
            var p=new Promise(function(resolve,reject){
                //处理异步任务
                var flag=true;
                setTimeout(function(){
                    if(flag){
                        resolve(str)
                    }
                    else{
                        reject('操作失败')
                    }
                })
            })
            return p;
        }

        fn('one')
        .then((data)=>{
            console.log(data);
            return fn('two');
        })
        .then((data)=>{
            console.log(data);
            return fn('three')
        })
        .then((data)=>{
            console.log(data);
        })
        .catch((data)=>{
            console.log(data);
        })

2、async/await

Async和Await

 

上一篇:Async和Await


下一篇:ES8--async/await