推荐书籍：https://www.kancloud.cn/kancloud/you-dont-know-js-async-performance
为了解决回调地狱带来的维护麻烦。引入promise

1.用promise封装一个http请求

    <script>
        function http() {
            return new Promise((resolve, reject) => {
                $.ajax({
                    url:"http://192.168.4.18:3000/top/playlist/?cat=华语",
                    method:"get",
                    success:res=>{
                        resolve(res)
                    },
                    error:res=>{
                        reject(res)
                    }
                })
            })
        }
        http().then(res=>{
            console.log(res);
        })
    </script>

2.用async和await替换then来解决异步问题

 var a = new Promise((resolve,reject)=>{
            setTimeout(()=>{
                resolve(1)
            },2000)
        })
        var b = new Promise((resolve,reject)=>{
            setTimeout(()=>{
                resolve(2)
            },1000)
        })
        // 不能解决异步问题
        a.then(res=>{
            console.log(res);
        })
        b.then(res=>{
            console.log(res);
        })
        // 能解决异步问题
        async function go(){
            var res = await a;
            var num = await b;
            console.log(res);
            console.log(num);
        }
        go()

3 关于运行顺序的问题

    <script>
        console.log(3);
        setTimeout(() => {
            console.log(2); 
        }, );
        Promise.resolve().then(()=>{
            console.log(1);
        })
    </script>
    <!-- 这个块单独运行return 3 1 2 -->
    <script>
        async function show(){
            console.log(4);
            var res = await 5;
            console.log(res);
        }
        show();
        console.log(6);
    </script>
    <!-- 这个块单独运行return 1 2 100 -->
    <!-- 两个块一起运行 return 3 1 4 6 5 2 -->

        <!--    1.promise 中的语句除了resolve,reject能直接执行
            2.遇到await先跳出函数执行他的同步代码，最后执行自己
            3.定时器最后执行
    -->
    <script>
        async function show(){
            console.log("start");
            var res = await go();
            console.log(res);
        }
        async function go (){
            return 1;
        }
        show();
        setTimeout(() => {
            console.log(4); 
        }, );
        var p = new Promise((resolve,reject)=>{
            console.log(2);
            resolve(3);
            console.log(5);
        })
        p.then((res)=>{
            console.log(res);
        })
        console.log("end");
    </script>
    <!-- return start 2 5 end 1 3 4 -->