万象更新 Html5 - es6 进阶: async/await

源码 https://github.com/webabcd/Html5
作者 webabcd

万象更新 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() 并发执行多个 Promiselet [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}
})();

源码 https://github.com/webabcd/Html5
作者 webabcd