<div id="div14"><h3> <font color=red /> 14，异步 async/await </font> <h3></div> async/await 就是 Generator 的语法糖， async 函数就是将 Generator 函数的星号（*）替换成 async，将 yield 替换成await。 Generator 函数：1，function关键字与函数名之间有一个星号； 2，函数体内部使用yield表达式，定义不同的内部状态。 ```javascript function sleep(ms) { return new Promise(function(resolve, reject) { setTimeout(resolve,ms); }) } async function handle(){ console.log("AAA") await sleep(5000) console.log("BBB") } handle(); // AAA // BBB (5000ms后) ``` ## Generator函数是什么，有什么用? `Generator`函数是`ECMAScript 6`提供的一种异步编程解决方案，语法行为与传统函数完全不同。 * `Generator`函数可以理解成**状态机**，封装了多个内部状态 * `Generator`函数也可以是一个普通函数，但具有两个特征 * `function`关键字与函数名之间有一个星好（\*） * 函数体内部使用`yield`表达式，定义不同的内部状态 执行`Generator`函数会返回一个遍历器对象，每一次`Generator`函数里面的`yield`表达式都相当于一次遍历器对象的`next()`方法，并且可以通过`next(value)`的方式传入自定义的值，来改变`Generator`函数的行为 #### `Generator`的用途 `Generator` 可以暂停函数执行，返回任意表达式的值。这种特点使得 Generator 有多种应用场景，例如： * 异步操作的同步化表达 * 控制流管理 * 部署`Iterator`接口 * 作为数据结构 ### 代码 Generator 函数是一个状态机，封装了多个内部状态。 ~~~ function* helloWorldGenerator() { yield 'hello'; yield 'world'; return 'ending'; } var hw = helloWorldGenerator(); ~~~ 调用后返回指向内部状态的指针, 调用next()才会移向下一个状态, 参数: ``` hw.next() // { value: 'hello', done: false } hw.next() // { value: 'world', done: false } hw.next() // { value: 'ending', done: true } hw.next() // { value: undefined, done: true } ```