es6-迭代器和生成器

作者: 安石0 | 来源:发表于2019-04-16 16:17 被阅读0次

2019-03-20
yield and Iterator
Python :生成器、迭代器、装饰器、递归函数与正则表达式
Python基础-16生成器-迭代器
es6-迭代器和生成器
es6-迭代器和生成器
python の可迭代、迭代器、生成器
14. Python之迭代器(iterator)和生成器(gen
python基础-11-迭代器生成器、模块和包
18.Python之生成器

迭代器

一个迭代器对象，知道如何每次访问集合中的一项，并跟踪该序列中的当前位置。在 JavaScript 中迭代器是一个对象，它提供了一个next() 方法，用来返回序列中的下一项。这个方法返回包含两个属性：done和 value。
es5可以模拟：

function createI(items) {
  let i = 0
  return {
   next () {
     i++
     return {
       done: items.length <= i ,
       value: items[i]
     } 
  }
}}
a = createI([{a: 1}, {b: 2}, {c: 3}])
a.next() // {done: false, value: {…}}done: falsevalue: {b: 2}__proto__:Object
a.next()  // {done: false, value: {…}}done: falsevalue: {c: 3}__proto__:Object
a.next() // {done: true, value: undefined}
a.next()  // {done: true, value: undefined}
a.next() // {done: true, value: undefined}
a.next()  // {done: true, value: undefined}

生成器

GeneratorFunction 是一个可以作为迭代器工厂的特殊函数。当它被执行时会返回一个新的Generator对象。如果使用function*语法，则函数将变为GeneratorFunction。每执行完一条yield(es6 关键字)语句就会停止执行。

function* idMaker() {
yield 1
yield 2
yield 3}
var gen = idMaker();
gen.next() // {value: 1, done: false}
gen.next() // {value: 2, done: false}
gen.next() // {value: 3, done: false}
gen.next() // {value: undefined, done: true}
gen.next() // {value: undefined, done: true}

yield关键字只能在生成器内部使用，类似于嵌套函数的return不能作为外部函数的return，yield的使用也不能穿透:

function *c (items) {
  items.forEach(v => {
    yield v // 报错：语法错误
  })
}

可迭代对象和for-of循环

可迭代对象具有Symbol.iterator属性,是一种与迭代器密切相关的对象。es6中数组，set，map，字符串都是可迭代的对象。

arr = [1,2,3]
for(let v of arr) {
 console.log(v)
}
1
2
3

for-of循环通过调用该对象的Symbol.iterator方法来获取迭代器，随后迭代器的next方法被多次调用，done属性为true退出循环。
也可以直接访问默认迭代器。

arr = [1,2,3]
arr[Symbol.iterator] // ƒ values() { [native code] }
a = arr[Symbol.iterator]()
a.next() // {value: 1, done: false}
a.next() // {value: 2, done: false}
a.next() // {value: 3, done: false}
a.next() // {value: undefined, done: true}
a.next() // {value: undefined, done: true}

内建迭代器

es6中三种类型的集合对象:数组 Map Set都内建了三种迭代器：entries() values() keys()

entries

function make(items) {
  for(let item of items.entries()){
  console.log(item)
}
}
a = ['a', 'b', 'c']
make(a)
 // [0, "a"]
 // [1, "b"]
 // [2, "c"]
b = new Set(['a', 'b', 'c'])
make(b)
// ["a", "a"]
//  ["b", "b"]
// ["c", "c"]
c = new Map([
  ['aa', 'a'],
  ['bb', 'b'],
  ['cc', 'c']
])
make(c)
// ["aa", "a"]
// ["bb", "b"]
// ["cc", "c"]

每项都是: [key, value], set key和value一样

values

function make1(items) {
  for(let item of items.values()){
  console.log(item)
}
}
make1(a)
a
b
c
make1(b)
a
b
 c
make1(c)
a
b
c

表现一致

keys

function make2(items) {
  for(let item of items.keys()){
  console.log(item)
}
}
make2(a)
0
1
2
make2(b)
a
b
c
make2(c)
aa
bb
cc

返回的是key,只包含索引，不包含其他属性。values的表现也是如此。但用其他的方式不一定：

a.xxx = 'xxx'
Object.keys(a) // ["0", "1", "2", "xxx"]
make2(a)
 0
 1
 3

给迭代器传参数

如果给迭代去的next方法传参数，这个参数的值就会替代生成器内部上一条yield语句的返回值。但第一次调用无论传什么值都会被忽略(因为替代的是上一条的返回值)。

function *createIt() {
  let first = yield 1
  let second = yield first +2
  yield second + 3
}
let it = createIt()
it.next(100) // 第一次忽略
// {value: 1, done: false}
it.next(200) // 用200替代了1
// {value: 202, done: false}
it.next(300) // 300替代了202
// {value: 303, done: false}

return 语句

function *createIt() {
  let first = yield 1
  let second = yield first +2
  yield second + 3
}
it = createIt()
it.next()
{value: 1, done: false}
it.next()
{value: "zlj", done: true}
it.next()
{value: undefined, done: true}

return表示所有操作已经完成，return的值作为value的值。done为true
比较有意思的是:

function *createIt() {
  yield 1
  return yield 'zlj'
  yield 2
  yield 3
}
it = createIt()
it.next()
{value: 1, done: false}
it.next()
{value: "zlj", done: false} // done为false，但是后面访问为true，因为先执行了yield语句，然后再执行return
it.next()
{value: undefined, done: true}
it.next()
{value: undefined, done: true}
it.next()
{value: undefined, done: true}

委托生成器

可以将多个生成器放在另一个生成器里面。

function *createIt1(){
  yield 1
  yield 2
}
function *createIt2(){
  yield 3
  yield 4
}
function *createIt(){
// 委托了两个生成器
  yield *createIt1()
  yield *createIt2()
}
it = createIt()
it.next()
{value: 1, done: false}
it.next()
{value: 2, done: false}
it.next()
{value: 3, done: false}
it.next()
{value: 4, done: false}
it.next()
{value: undefined, done: true}
// 直到不能再返回为止

简单任务执行器

由于yield语句会暂停当前的函数执行过程，并且等待下一次调用next()方法。因此可以创建一个函数，在调用过程中生成相应的迭代器，从而在不用回调函数的情况下实现异步编程:

function run(taskFn) {
  let task = taskFn()
  let result = task.next()
  function step () {
    if (!result.done) {
      result = task.next()
      step()
    }
  }
  step()
}
run(function *() {
console.log(0)
 yield 1
console.log(1)
 yield 2
console.log(2)
 yield 3
console.log(3)
})
0
1
2
3

node.js 版

// 多任务执行 生成器版
const fs = require('fs')
function run (taskDef) {
  let task = taskDef()
  let result = task.next()
  function step () {
    if (!result.done) {
      if (typeof result.value === 'function') {
        result.value((err, data) => {
          if(err) {
            result = task.throw(err)
            return
          }
          result = task.next(data)
          step()
        })
      } else {
        result = task.next(result.value)
        step()
      }
    }
  }
  step()
}
function readFile(file) {
  return function (cb) {
    fs.readFile(file, cb)
  }
}
run(function *() {
  let contents = yield  readFile('./README.md')
  console.log('c', contents)
  let contents2 = yield readFile('./package.json')
  console.log('c2', contents2)
  let content3 = yield readFile('./gulpfile.js')
  console.log('c3', content3)
  console.log('done')
})

// 多任务执行 promisie版
const fs = require('fs')
function run (taskDef) {
  let task = taskDef()
  let result = task.next()
  function step () {
    if (!result.done) {
      let p = Promise.resolve(result.value)
      p.then(function (v) {
        result = task.next(v)
        step()
      }).catch(function (error) {
        result = task.throw(error)
        step()
      })
    }
  }
  step()
}
function readFile(file) {
  return new Promise(function (resolve, reject) {
    fs.readFile(file, (err, data) => {
      if (err) {
        reject(err)
      } else {
        resolve(data)
      }
    })
  })
}
run(function *() {
  let contents = yield  readFile('./README.md')
  console.log('c', contents)
  let contents2 = yield readFile('./1package.json')
  console.log('c2', contents2)
  let content3 = yield readFile('./gulpfile.js')
  console.log('c3', content3)
  console.log('done')
})

用async await 更简洁

生成器实现异步编程

传统的异步编程:

// 这是一个回调地狱
fs.readFile(fileA, 'utf-8', function (err, data) {
  fs.readFile(fileB, 'utf-8', function (err, data) {
    // ...
  });
});
// 或者使用promise
var readFile = require('fs-readfile-promise');

readFile(fileA)
.then(function (data) {
  console.log(data.toString());
})
.then(function () {
  return readFile(fileB);
})
.then(function (data) {
  console.log(data.toString());
})
.catch(function (err) {
  console.log(err);
});
// 这样每次完成都有return一个新的promise

2019-03-20
1 迭代器和生成器迭代器获取数据：next （迭代器）、for 循环遍历，数据来源：转换、生成器生成器：...
yield and Iterator
Generator（生成器）生成器是特殊的迭代器，迭代器不一定是生成器。生成器与迭代器均是可迭代对象。目前学...
Python :生成器、迭代器、装饰器、递归函数与正则表达式
Python 第四篇:生成器、迭代器、装饰器、递归函数与正则表达式 Python迭代器和生成器 Python 迭代...
Python基础-16生成器-迭代器
16.生成器-迭代器可循环迭代的对象称为可迭代对象，迭代器和生成器函数是可迭代对象，在Python中提供...
es6-迭代器和生成器
前言从家里回来了，翻了翻书，发现es6的知识点，忘了不少，还好记了点笔记，今年需要更加努力，看着以前的同学都开始...
es6-迭代器和生成器
迭代器一个迭代器对象，知道如何每次访问集合中的一项，并跟踪该序列中的当前位置。在 JavaScript 中...
python の可迭代、迭代器、生成器
生成器：生成器是一种特殊的迭代器，生成器自动实现了“迭代器协议”（即__ iter__和__ next __方法...
14. Python之迭代器(iterator)和生成器(gen
1 什么是迭代器 2 为何要有迭代器 3 如何用迭代器 4 生成器生成器应用案例
python基础-11-迭代器生成器、模块和包
1.迭代器和生成器 1.迭代器 2.生成器generator 2.模块和包 3.扩展外传参数
18.Python之生成器
Python之生成器生成器在Python社区，生成器和迭代器被看作一种工具，生成器的本质就是迭代器。唯一的区别就...