js ES8 async await

1.async函数

 async函数的返回值是promise对象

 promise对象的结果由async函数执行的返回值决定

        async function fn(){
            //返回字符串
            // return 'yuanyuan';
            //如果返回的不是Promise对象，那么返回的就是一个成功的Promise对象
            // return;
            // 抛出错误，返回的结果是一个失败的Promise
            // throw new Error("出错了！");
            // 返回的结果如果是一个Promise对象
            return new Promise((resolve, reject) =>{
                resolve('成功的数据');
                // reject("失败的数据");
            })
        }
        const res = fn();
        console.log(res);
        //调用then方法
        res.then(value => {
            console.log(value);
        }, reason =>{
            console.warn(reason);
        })

 

2. await 必须写在 async 函数中

await 右侧的表达式一般为 promise对象

await 返回的是promise成功的值

await 的promise失败了，就会抛出异常，需要通过 try...catch捕获处理

const p = new Promise((resolve,reject) =>{
            // resolve("成功的值");
            reject("失败！")
        })
        async function main(){
            try{
                let res = await p;
                console.log(res);
            } catch (e) {
                console.log(e);
            }
            // let res = await p;
            // console.log(p);
        }
        main();

 

3.用async和await封装一个AJAX请求

        // 发送AJAX请求,返回的结果是Promise对象
        function sendAJAX(url){
           return new Promise((resolve,reject)=>{
                // 1.创建对象
                const x = new XMLHttpRequest();
                // 2.初始化
                x.open('GET',url);
                // 3.发送
                x.send();
                // 4.事件绑定
                x.onreadystatechange = function(){
                    if(x.readyState === 4){
                        if(x.status >= 200 && x.status < 300){
                            // 成功了
                            resolve(x.response);
                        } else {
                            // 如果失败
                            reject(x.status);
                        }
                    }
                }
           })
        }

        // promise then 测试
        // const res = sendAJAX("https://api.apiopen.top/getJoke").then(value => {
        //     console.log(value);
        // },reason => {});
        // console.log(res);

        // async await测试
        async function main(){
            // 发送AJAX请求
            let res = await sendAJAX("https://api.apiopen.top/getJoke");
            console.log(res);
        }
        main();