万象更新 Html5 - es6 进阶: async/await
万象更新 Html5 - es6 进阶: async/await
示例如下:
es6\src\advanced\async_await.js
/**
* async/await - 用于异步编程(非多线程)
* async function 返回的是 Promise 对象
* await 用于等 Promise 对象或者 thenable 对象,其只能放在 async function 中
* 所谓的 thenable 对象,就是定义了 then() 方法的对象
*/
// async function 的说明
// p1() 等价于 p2()
function p1() {
return Promise.resolve("webabcd");
}
async function p2() { // 对于 async function 来说,会用 Promise.resolve() 来包装返回对象
return "webabcd";
}
console.log(p1(), p2());
// Promise {<resolved>: "webabcd"} Promise {<resolved>: "webabcd"}
// await 的说明(只能放在 async function 中)
async function sleep(ms) {
await new Promise((resolve) => {
setTimeout(resolve, ms);
});
}
async function a(value, ms) {
await sleep(ms);
console.log(value);
}
let promise1 = a("webabcd", 1000);
console.log(promise1); // 1 秒钟之后会打印 webabcd
// 这里打印的是 Promise {<pending>}
// 如果在非 async function 中,想实现 await 的功能怎么办,可以通过 promise 的 then() 来实现
async function b(value, ms) {
await new Promise(r => setTimeout(r, 1000)); // 等 1 秒
return value;
}
let promise2 = b("wanglei", 1000);
promise2.then(v => console.log(v));
// 1 秒钟之后会打印 wanglei
// 如果一个类有 then() 方法,则这个类的实例化对象是 thenable 对象
// await 除了用于等待 Promise 对象外,也可以用于等待 thenable 对象
// await 一个 thenable 对象时,实际上等待的是这个对象的 then() 方法
class Sleep {
constructor(timeout) {
this.timeout = timeout;
}
then(resolve, reject) {
setTimeout(() => resolve("diandian"), this.timeout);
}
}
(async () => {
console.log(await new Sleep(1000)); // 1 秒钟之后会打印 diandian
})();
// 演示如何对 await 做 try/catch
let c = () => {
return new Promise((resolve, reject) =>{
setTimeout(()=>{
let x = new Date().getTime() % 2;
if (x == 0) {
return resolve("fulfilled"); // 如果 try/catch await 的话,这里会正常返回数据
} else if (x == 1) {
return reject("rejected"); // 如果 try/catch await 的话,这里会捕获到异常
}
},1000);
});
};
(async () => {
try {
// 如果走到 Promise 的 resolve() 则可以正常收到返回数据
console.log("try: " + await c()); // try: fulfilled
} catch(e) {
// 如果走到 Promise 的 reject() 则会捕获到异常
console.log("catch: " + e); // catch: rejected
}
})();
// 并发执行多个 Promise
let i = async () => {
return Promise.resolve("iii");
};
let j = async (ms) => {
return new Promise((resolve) => {
setTimeout(() => resolve("jjj"), ms);
});
};
let k = async (ms) => {
return new Promise((resolve, reject) => {
let x = new Date().getTime() % 2;
if (x == 0) {
setTimeout(() => resolve("kkk"), ms);
} else if (x == 1) {
setTimeout(() => reject("kkk"), ms);
}
});
};
(async () => {
try {
// 通过 Promise.all() 并发执行多个 Promise
let [x, y, z] = await Promise.all([i(), j(1000), k(1000)]);
console.log(x, y, z); // iii jjj kkk
} catch (e) {
// 有一个 Promise 走到了 reject(),这里就会捕获到异常
console.log(e); // kkk
}
})();