1、返回一个 Promise 对象
async
函数返回一个 Promise 对象。
async
函数内部return
语句返回的值,会成为then
方法回调函数的参数。
async function myFn(someValue){
return someValue
}
myFn("春夏秋冬").then(res=> console.log(res)) //春夏秋冬
2、Promise 对象对象状态的变化
只有async
函数内部的异步操作执行完,才会发生状态改变,才会执行then
方法指定的回调函数。
async function getTitle(url) {
let response = await fetch(url);
let html = await response.text();
return html.match(/<title>([\s\S]+)<\/title>/i)[1];
}
getTitle('https://tc39.github.io/ecma262/').then(console.log)
上面代码中,函数getTitle
内部有三个操作:抓取网页、取出文本、匹配页面标题。只有这三个操作全部完成,才会执行then
方法里面的console.log
。
3、await 命令
正常情况下,await
命令后面是一个 Promise 对象,返回该对象的结果。如果不是 Promise 对象,就直接返回对应的值。
async function getStockPriceByName(name) {
const symbol = await getStockSymbol(name);
const stockPrice = await getStockPrice(symbol);
return stockPrice;
}
function getStockSymbol(myName) {
return new Promise(function (resolve, reject) {
resolve(myName+'今年21岁');
console.log(myName, '----myName----');
});
}
function getStockPrice(id) {
return new Promise(function (resolve, reject) {
resolve(id+"@大学:清华");
console.log(id, '----id-');
});
}
getStockPriceByName('小张').then(function (result) {
console.log(result, '-----result------');
});
eg:打印结果如下
小张 ----myName----
小张今年21岁 ----id-
103 小张今年21岁@大学:清华 -----result------
使用注意点:
await
命令后面的Promise
对象,运行结果可能是rejected
,所以最好把await
命令放在try...catch
代码块中。
async function myFunction() {
try {
await somethingThatReturnsAPromise();
} catch (err) {
console.log(err);
}
}
多个await
命令后面的异步操作,如果不存在继发关系,最好让它们同时触发。
//不推荐
let foo = await getFoo();
let bar = await getBar();
//推荐
// 写法一
let [foo, bar] = await Promise.all([getFoo(), getBar()]);
// 写法二
let fooPromise = getFoo();
let barPromise = getBar();
let foo = await fooPromise;
let bar = await barPromise;