小议JavaScript中Generator和Iterator的使用

一说到 Generator,大家就会扯上异步之类是话题。这显然是被一些奇奇怪怪的东西带坏了。与 Generator 关系密切的应该是 Iterator 才对,拿 Generator 来处理异步也许是一些 C# 程序员才会想的事。当然这种用法确实有一套完整的东西,只是我个人不喜欢而已。
  非要把 Generator 和异步联系上,唯一的点就是 next 的调用时机。因为 next 可以异步地调用,所以 Generator 才得以被异步地滥用。
  但我觉得 next 这个方法虽然可以异步调用,但正确的使用方式应该是同步的。至少当一个 Generator 实例被用于 for-of 循环或 [...obj] 解构时都是连续调用 next 的。
  除了 next 的同异步问题外,next 的参数也是个问题。由于 next 调用时传入的参数会被作为 yield 运算符的返回值,所以 generator 有了更丰富的使用方式。在早期的 python 中 yield 是语句而不是运算符,所以也不存在这样的用法。后来的版本才把 yield 作为运算符,所以才出现了各种坑。
  把 Generator 实例作为 Iterator 时既不会异步调用 next,也不会给 next 传入参数。我觉得这才是 Generator 的正确用法。或者说白了,Generator 就是用来实现 Iterator 的。至少 Generator 这个名字没有别的含义了。下面是一个用法示例:
运行

<script>
var match = function * (pattern, string) {
 var regexp = new RegExp(pattern, 'g');
 for(let i; i = regexp.exec(string); yield i);
};

for(let i of match('a', 'abcabcabc')) {
 console.log(i);
}
</script>
(0)

相关推荐

  • 浅析JavaScript 箭头函数 generator Date JSON

    ES6 标准新增了一种新的函数: Arrow Function(箭头函数). x => x *x 上面的箭头相当于: function (x){ return x*x; } 箭头函数相当于匿名函数,并且简化了函数定义.一种像上面的,只包含一个表达式, 连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... }和return: x =>{ if(x > 0){ return x * x; }else{ return -x *x; } } 如果参数不是

  • 深入理解js generator数据类型

    1. 概述 generator 是ES6引入的新的数据类型, 看上去像一个函数,除了使用return返回, yield可以返回多次. generator 由function* 定义, (注意*号), 2. 例子 函数无法保存状态, 有时需要全局变量来保存数字: 2.1 'use strict'; function next_id(){ var id = 1; while(id<100){ yield id; id++; } return id; } // 测试: var x, pass = tr

  • JavaScript中 ES6 generator数据类型详解

    1. generator简介 generator 是ES6引入的新的数据类型, 看上去像一个函数,除了使用return返回, yield可以返回多次. generator 由function* 定义, (注意*号), 2. 示例 函数无法保存状态, 有时需要全局变量来保存数字: 2.1 'use strict'; function next_id(){ var id = 1; while(id<100){ yield id; id++; } return id; } // 测试: var x,

  • js使用generator函数同步执行ajax任务

    本文实例为大家分享了js使用generator函数同步执行ajax任务的具体代码,供大家参考,具体内容如下 function request(url, callback) { fetch(url, {mode: 'cors', credentials: 'include', headers: new Headers({ 'X-Requested-With': 'XMLHttpRequest' })}) .then(response => response.text()) .then(text =

  • 详解JavaScript ES6中的Generator

    今天讨论的新特性让我非常兴奋,因为这个特性是 ES6 中最神奇的特性. 这里的"神奇"意味着什么呢?对于初学者来说,该特性与以往的 JS 完全不同,甚至有些晦涩难懂.从某种意义上说,它完全改变了这门语言的通常行为,这不是"神奇"是什么呢. 不仅如此,该特性还可以简化程序代码,将复杂的"回调堆栈"改成直线执行的形式. 我是不是铺垫的太多了?下面开始深入介绍,你自己去判断吧. 简介 什么是 Generator? 看下面代码: function* qu

  • 在Node.js中使用Javascript Generators详解

    Generators是Javascript的一种协同程序( coroutine 简称:协程)风格,是指那些可以在执行时暂停然后又恢复的函数,该函数是在functi配以星号符号形式如function* ,函数内有些特征关键词如yield 和yield*. function* generatorFn () { console.log('look ma I was suspended') } var generator = generatorFn() // [1] setTimeout(functio

  • 小议JavaScript中Generator和Iterator的使用

    一说到 Generator,大家就会扯上异步之类是话题.这显然是被一些奇奇怪怪的东西带坏了.与 Generator 关系密切的应该是 Iterator 才对,拿 Generator 来处理异步也许是一些 C# 程序员才会想的事.当然这种用法确实有一套完整的东西,只是我个人不喜欢而已. 非要把 Generator 和异步联系上,唯一的点就是 next 的调用时机.因为 next 可以异步地调用,所以 Generator 才得以被异步地滥用. 但我觉得 next 这个方法虽然可以异步调用,但正确的使

  • 小议Javascript中的this指针

    (1) 在全局执行环境中使用this,标识Global对象,在浏览器中就是window对象. (2)当在函数执行环境中使用this时,如果函数没有明显的作为非window对象的属性,而是只是定义了函数,不管这个函数是不是定义在另一个函数中,这个函数中的this仍然标识window对象.如果函数显示地作为一个非window对象的属性,那么函数中的this就代表这个对象. 复制代码 代码如下: var o=new Object; o.func=function() { alert((this===o

  • JavaScript中Iterator迭代器接口和循环

    目录 JavaScript的迭代器(Iterator)介绍 for...of循环与for...in循环 JavaScript的迭代器(Iterator)介绍 迭代器是数据结构遍历的一种机制(或者是什么我也不太懂的行业术语),为数据结构定义了统一的遍历规则. 迭代器(Iterator)主要是提供for...of使用,或者说,数据结构只有实现了迭代器(Iterator)接口才能使用for...of进行遍历数据,当一种数据结构没有实现迭代器(Iterator)接口时,去使用for...of操作,就会被

  • 详谈ES6中的迭代器(Iterator)和生成器(Generator)

    前面的话 用循环语句迭代数据时,必须要初始化一个变量来记录每一次迭代在数据集合中的位置,而在许多编程语言中,已经开始通过程序化的方式用迭代器对象返回迭代过程中集合的每一个元素 迭代器的使用可以极大地简化数据操作,于是ES6也向JS中添加了这个迭代器特性.新的数组方法和新的集合类型(如Set集合与Map集合)都依赖迭代器的实现,这个新特性对于高效的数据处理而言是不可或缺的,在语言的其他特性中也都有迭代器的身影:新的for-of循环.展开运算符(...),甚至连异步编程都可以使用迭代器 本文将详细介

  • JavaScript 中使用 Generator的方法

    Generator 是一种非常强力的语法,但它的使用并不广泛(参见下图 twitter 上的调查!).为什么这样呢?相比于 async/await,它的使用更复杂,调试起来也不太容易(大多数情况又回到了从前),即使我们可以通过非常简单的方式获得类似体验,但是人们一般会更喜欢 async/await. 然而,Generator 允许我们通过 yield 关键字遍历我们自己的代码!这是一种超级强大的语法,实际上,我们可以操纵执行过程!从不太明显的取消操作开始,让我们先从同步操作开始吧. 我为文中提到

  • 谈谈JavaScript中浏览器兼容问题的写法小议

    前言 JavaScript中很多坑,其中对浏览器的兼容也是一个问题,本文就简略的归纳了部分针对浏览器兼容问题的写法的例子,旨在便于查找.如果读者有什么好的意见建议,请留言交流,谢谢! window窗口大小 1.在IE9+.Chrome.Firefox.Opera以及Safari中 window.innerHeight获取浏览器窗口的内部高度 window.innerWidth获取浏览器窗口的内部宽度 var msg = "窗口宽度:" + window.innerHeight + &q

  • 详解JavaScript中操作符和表达式

    一.一元操作符 1.delete操作符 delete 操作符用于删除对象的某个属性:如果没有指向这个属性的引用,那它最终会被释放 语法:delete expression delete 操作符会从某个对象上移除指定属性.成功删除的时候回返回 true,否则返回 false let Employee = { age: 28, name: 'abc', designation: 'developer' }; console.log(delete Employee.name); // returns

  • JavaScript中箭头函数与普通函数的区别详解

    本文为大家讲解了JavaScript中箭头函数与普通函数的区别,供大家参考,具体内容如下 箭头函数: let fun = () => { console.log('lalalala'); } 普通函数: function fun() { console.log('lalla'); } 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... }和return. 箭头函数是匿

  • JavaScript中的迭代器和可迭代对象与生成器

    目录 1. 什么是迭代器? 1.1 迭代器的基本实现 1.2 迭代器的封装实现 2. 什么是可迭代对象 2.1 原生可迭代对象(JS内置) 2.1.1 部分for of 演示 2.1.2 查看内置的[Symbol.iterator]方法 2.2 可迭代对象的实现 2.3 可迭代对象的应用 2.4 自定义类迭代实现 3. 生成器函数 3.1 生成器函数基本实现 3.2 生成器函数单次执行 3.3 生成器函数多次执行 3.4 生成器函数的分段传参 3.5 生成器代替迭代器 4. 可迭代对象的终极封装

随机推荐