async函数
ES7引进的异步编程的最终解决方案,完善的Generator函数
Generator函数
var fs = require('fs');
var readFile = function (fileName) {
return new Promise(function (resolve, reject) {
fs.readFile(fileName, function(error, data) {
if (error) reject(error);
resolve(data);
});
});
};
var gen = function* () {
var f1 = yield readFile('/etc/fstab');
var f2 = yield readFile('/etc/shells');
console.log(f1.toString());
console.log(f2.toString());
};
等价的async函数
var asyncReadFile = async function () {/*不要*号了,换成async*/
var f1 = await readFile('/etc/fstab');/*将yield换成await*/
var f2 = await readFile('/etc/shells');
console.log(f1.toString());
console.log(f2.toString());
};
毫无疑问,async函数更加简便而且容易理解,async表示该函数存在异步操作,await则代表该语句段可能需要等待结果
而且async函数内置执行器
var result = asyncReadFile();
而且返回的结果是Promise对象,可以紧接着.then()
用法
函数执行时,先等待await
执行完成(先返回),再执行后面的语句
因为返回的是一个Promise对象,所以可以使用.then()
添加回调函数
// 函数声明
async function foo() {}
// 函数表达式
const foo = async function () {};
// 对象的方法
let obj = { async foo() {} };
obj.foo().then(...)
// Class 的方法
class Storage {
constructor() {
this.cachePromise = caches.open('avatars');
}
async getAvatar(name) {
const cache = await this.cachePromise;
return cache.match(`/avatars/${name}.jpg`);
}
}
const storage = new Storage();
storage.getAvatar('jake').then(…);
// 箭头函数
const foo = async () => {};
实例
function timeout(ms) {
return new Promise((resolve) => {
setTimeout(resolve, ms);
});
}
async function asyncPrint(value, ms) {
await timeout(ms);//等待执行完毕
console.log(value)
}
asyncPrint('hello world', 50);
Promise状态变化
只有执行完所有await后的Promise对象才会发生状态改变(除非return或抛出错误)
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)
// "ECMAScript 2017 Language Specification"