async的作用
作用： 使得异步操作更加方便
async：它会返回一个Promise对象，一个async异步函数可以包含await指令，该指令会暂停异步函数的执行，并等待Promise执行，然后继续执行异步函数，并返回结果。
await关键字只在异步函数内有效。如果你在异步函数外使用它，会抛出语法错误。
注意： 当异步函数暂停时，它调用的函数会继续执行(收到异步函数返回的隐式Promise)。
async函数与Promise、Generator函数一样，是用来取代回调函数、解决异步操作的一种方法。它本质上是Generator函数的语法糖。
三者共同的作用：
1. 解决回调地狱
2. 使得异步操作显得更加方便
async function fun() {
//await使函数停止等待，知道遇到return为止，将结果返回
return await 'hello async';//async会将这个字符串转成Promise对象
}
fun().then(value => {
console.log(value);//hello async
}).catch(err => {
console.log(err);
});
多个await命令
如果async函数中有多个await，那么then函数会等待所有的await指令运行完之后的结果，才去执行。
async function fun() {
let str = await 'hello async';
let data = str.split('');
return data;
}
fun().then(value => {
console.log(value);//["h", "e", "l", "l", "o", " ", "a", "s", "y", "n", "c"]
}).catch(err => {
console.log(err);
});
如果多个await中有一个后面跟Promise.reject()操作，此时运行到这个Promise.reject()后就不会再继续往下执行。
async function fun() {
await Promise.reject('错误');
return await Promise.resolve('hello async');
}
fun().then(value => console.log(value)).catch(err => console.log(err));//错误
解决：
async function fun() {
try {
await Promise.reject('错误');
} catch (e) {
}
return await Promise.resolve('hello async');
}
fun().then(value => console.log(value)).catch(err => console.log(err));//hello async
案例
获取天气接口中现在now的数据：
const getJSON = function (url) {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.onreadystatechange = handler;
xhr.responseType = 'json';
xhr.setRequestHeader('Accept', 'application/json');
//发送
xhr.send();
function handler() {
//console.log(this);
if (this.readyState === 4) {//0表示初始化，1表示还没发送，2、3表示当前进行中，4表示完成
if (this.status === 200) {//200表示成功
resolve(this.response);
} else {
reject(new Error(this.statusText));
}
}
}
})
};
async function getNowWeather(url) {
//发送ajax获取实况天气
let res = await getJSON(url);
console.log(res);
//获取HeWeather6的数据
let weather = res.HeWeather6;
console.log(weather);
return weather[0].now;
}
getNowWeather('https://free-api.heweather.net/s6/weather/now?location=beijing&key=4693ff5ea653469f8bb0c29638035976').then(now => {
console.log(now);
})
