ES6中生成器函数的讲解(代码示例)
概述
其实前几章我都不知道怎么写,因为他们总是涉及到一些比较深的东西,比如可迭代对象
、生成器
、迭代器
之类的东西,等写完这个系列,再好好整理一下这些东西可能会好一点,现在整理到哪儿就写到哪儿吧
语法
function* name([param[, param[, ... param]]]) { statements }
使用function*作为声明标识符,表示这是一个生成器函数
name是函数名
param是参数名,可以255个
statements是函数体
特点
生成器函数在执行的时候是可以暂停的,需要的时候再继续执行
生成器函数返回的是一个迭代器对象,不会立即执行
生成器函数可以使用return,但是return之后将不可再迭代
栗子-无限id增长器
function* idMaker(begin=0){ while(true) yield begin++; } let maker=idMaker(0) console.log(maker.next().value) // 0 console.log(maker.next().value) // 1 console.log(maker.next().value) // 2 console.log(maker.next().value) // 3 ...
说明:
调用生成器函数返回的是一个迭代器,迭代器是一个满足迭代器协议的对象,简单的说,迭代器对象有一定有一个next函数,该函数返回一个对象,我们称之为迭代结果对象,该对象包含以下两个属性:
value:本次迭代的结果
done:布尔值,如果为true,表示无法再继续迭代,如果为false,表示可以继续迭代。
调用next函数,将会让生成器函数真正的执行,一直执行,直到遇见yield,并返回迭代结果对象
栗子-有限id
增长器
function* idMaker(begin=0){ while(begin<3) yield begin++; } let maker=idMaker(0) console.log(maker.next()) // {value: 0, done: false} console.log(maker.next()) // {value: 1, done: false} console.log(maker.next()) // {value: 2, done: false} console.log(maker.next()) // {value: undefined, done: true}
如果函数执行完成了,那么done就自动变成true
next接收参数
function *createIterator() { let first = yield 1; let second = yield first + 2; // 4 + 2 // first =4 是next(4)将参数赋给上一条的 yield second + 3; // 5 + 3 } let iterator = createIterator(); console.log(iterator.next()); // "{ value: 1, done: false }" console.log(iterator.next(4)); // "{ value: 6, done: false }" console.log(iterator.next(5)); // "{ value: 8, done: false }" console.log(iterator.next()); // "{ value: undefined, done: true }"
这个解释起来挺麻烦,第一次调用iterator.next(),返回1,代码停在了yield 1,但是我们将yield 1的结果保存在了first变量中,其实这个操作是没有发生的,当我们第二次执行iterator.next(4),注意这里传递了一个参数4,此时会把4当做yield 1的返回值,赋值给first,所以第二次执行可以看做是let first=4的这么一个执行顺序。
return
function* yieldAndReturn() { yield "1"; return "2"; yield "3"; } var gen = yieldAndReturn() console.log(gen.next()); // { value: "1", done: false } console.log(gen.next()); // { value: "2", done: true } console.log(gen.next()); // { value: undefined, done: true }
以上就是ES6中生成器函数的讲解(代码示例)的详细内容,更多请关注其它相关文章!
上一篇: 怎样用php显示源代码,该如何解决
下一篇: layui表格实现代码