<!DOCTYPE html> <html> <head> <Meta charset="utf-8"> <title></title> </head> <body> <div>es6</div> <script type="text/javascript"> // async函数就是将 Generator 函数的星号(*)替换成async,将yield替换成await,仅此而已 // async函数返回一个 Promise 对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句 // Generator 函数的执行必须靠执行器,所以才有了co模块,而async函数自带执行器和普通函数一样执行 // async函数对 Generator 函数的改进: /* (1)内置执行器 (2)更好的语义 (3)更广的适用性 (4)返回值是 Promise */ async function fun() { try { return await 123; // 等同于 return 123; 正常情况下,await命令后面是一个 Promise 对象,返回该对象的结果。如果不是 Promise 对象,就直接返回对应的值 } catch (err) { console.log(err); } } // 只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数 fun().then(res => { console.log(res, 'res') // 123 "res" }) async function fn1() { try { // 如果有多个await命令,可以统一放在try...catch结构中 const res1 = await 123; const res2 = await 456; const res3 = await 789; // await new Promise(function (resolve, reject) { // throw new Error('出错了'); // }); console.log(res1, res2, res3) // 先执行 123 456 789 } catch (e) { // throw new Error('出错了'); // async函数内部抛出错误,会导致返回的 Promise 对象变为reject状态。抛出的错误对象会被catch方法回调函数接收到 } return await Promise.resolve('hello world'); } fn1().then(res => console.log(res, 'res2')) // 后执行 hello world res2 // async 函数的实现原理,就是将 Generator 函数和自动执行器,包装在一个函数里。 async function fn(args) { // ... } // 等同于 function fn(args) { return spawn(function*() { // ... }); } function spawn(genF) { return new Promise(function(resolve, reject) { const gen = genF(); function step(nextF) { let next; try { next = nextF(); } catch (e) { return reject(e); } if (next.done) { return resolve(next.value); } Promise.resolve(next.value).then(function(v) { step(function() { return gen.next(v); }); }, function(e) { step(function() { return gen.throw(e); }); }); } step(function() { return gen.next(undefined); }); }); } </script> </body> </html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。