🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 1.generator基础 generator函数最大的特点是交出函数的执行权。 ~~~ function *gen(x){ yiled x+2; return x; } ~~~ >它不同于普通函数,是可以暂停执行的,所以函数名之前要加星号,以示区别 ~~~ var g = gen(1); g.next() // { value: 3, done: false } g.next() // { value: undefined, done: true } ~~~ - 调用generator函数不会立即执行,而是会返回一个遍历器g - g 的 next 方法,会移动内部指针(即执行异步任务的第一段),指向第一个遇到的 yield 语句,上例是执行到 x + 2 为止 - next 方法的作用是分阶段执行 Generator 函数。每次调用 next 方法,会返回一个对象 - 回一个对象,表示当前阶段的信息( value 属性和 done 属性) - value 属性是 yield 语句后面表达式的值,表示当前阶段的值;done 属性是一个布尔值,表示 Generator 函数是否执行完毕,即是否还有下一个阶段 ## 2. Generator 函数的数据交换和错误处理 函数体内外的数据交换和错误处理机制。 ### 2.1函数体内外的数据交换 ~~~ function* gen(x){ var y = yield x + 2; return y; } var g = gen(1); g.next() // { value: 3, done: false } g.next(2) // { value: 2, done: true } ~~~ - next 方法返回值的 value 属性,是 Generator 函数向外输出数据;next 方法还可以接受参数,这是向 Generator 函数体内输入数据。 - 第一个 next 方法的 value 属性,返回表达式 x + 2 的值(3) - 第二个 next 方法带有参数2,这个参数可以传入 Generator 函数,作为上个阶段异步任务的返回结果,被函数体内的变量 y 接收。因此,这一步的 value 属性,返回的就是2(变量 y 的值)。 ### 2.2错误处理 ~~~ function* gen(x){ try { var y = yield x + 2; } catch (e){ console.log(e); } return y; } var g = gen(1); g.next(); g.throw('出错了'); // 出错 ~~~ ~~~ function *gen(x){ var y = yield 10+x; yield x+y } var g = gen(1); console.log(g.next()) console.log(g.next(40)) ~~~