深入理解js generator数据类型

更新时间：2016年08月16日 09:21:07 投稿：jingxian

下面小编就为大家带来一篇深入理解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 = true,
  g = next_id();
for (x = 1; x < 100; x ++) {
  if (g.next().value !== x) {
    pass = false;
    alert('测试失败!');
    break;
  }


}
if (pass) {
  alert('测试通过!');
}

2.2 一个无限循环的迭代器

function* idMaker(){
  var index = 0;
  while(true)
    yield index++;
}

var gen = idMaker(); // "Generator { }"

console.log(gen.next().value); // 0
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2

2.3Generator.prototype.next()

当迭代结束时， Generator.next().done ===true, 结束之前 ===false

function* gen() { 
 yield 1;
 yield 2;
 yield 3;
}

var g = gen(); // "Generator { }"
g.next();   // "Object { value: 1, done: false }"
g.next();   // "Object { value: 2, done: false }"
g.next();   // "Object { value: 3, done: false }"
g.next();   // "Object { value: undefined, done: true }"

2.4 Generator.prototype.return();

return方法返回给定的参数值，并结束迭代器

example

function* gen() { 
 yield 1;
 yield 2;
 yield 3;
}

var g = gen();

g.next();    // { value: 1, done: false }
g.return("foo"); // { value: "foo", done: true }
g.next();    // { value: undefined, done: true }

注意如果 done的值是true了，再调用return，返回的值也是undefined

function* gen() {yield 1;}
var g = gen();
console.log(g.next());//{ value: 1, done: false }
console.log(g.next());//{ value: undefined, done: true }
console.log(g.return(1)); //{ value: undefined, done: true }

2.5 Generator.prototype.throw()

thorw()方法，通过抛出一个异常到迭代器中，来重新获得迭代器的执行；

返回带有 value和done两个属性的object对象

function* gen() {
 while(true) {
  try {
    yield 42;
  } catch(e) {
   console.log("Error caught!");
  }
 }
}

var g = gen();
var a = g.next();
// { value: 42, done: false }
var b = g.throw(new Error("Something went wrong"));
// "Error caught!"
// { value: 42, done: false }
console.log(a);
console.log(b.value+"::"+b.done);

以上这篇深入理解js generator数据类型就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

解决URL地址中的中文乱码问题的办法
这篇文章主要介绍了解决URL地址中的中文乱码问题的办法的相关资料,需要的朋友可以参考下
2017-02-02
微信小程序webView嵌入H5的方法实例
web-view是小程序提供的一个可以直连h5页面的组件,只要传递一个h5页面的地址,就可以在小程序里直接打开预览该h5页面,这篇文章主要给大家介绍了微信小程序webView嵌入H5的相关资料,需要的朋友可以参考下
2021-07-07
用js实现计算代码行数的简单方法附代码
用js实现计算代码行数的简单方法附代码...
2007-08-08
简单实现Bootstrap标签页
这篇文章主要教大家简单实现Bootstrap标签页，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-12-12
JavaScript中for of和for in的区别详解
对于初学者，我们或许只知道无论是for of还是for in他们都有一个功能那就是遍历，至于具体的细节或许我们不是很清楚，那么接下来我们就来详细的区分一下for of和for in他们之间的不同点和相同点,需要的朋友可以参考下
2023-06-06
ASP中Sub和Function的区别说明
主要的区别是有返回值，一般sub是用来调用大量的内容的时候用sub，对于需要计算并需要返回值的时候用function，多用function定义函数。
2011-01-01
Javascript获取页面元素的绝对位置实现
这篇文章主要为大家介绍了Javascript获取页面元素的绝对位置实现详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-11-11
收藏一个代码
收藏一个代码...
2006-08-08
深入浅析JavaScript中的Function类型
Function是javascript里最常用的一个概念，javascript里的function是最容易入手的一个功能，但它也是javascript最难理解最难掌握的一个概念。这篇文章主要介绍了JavaScript中的Function类型的相关资料，一起看下吧
2016-07-07
微信小程序时间轴组件的示例代码
这篇文章主要介绍了微信小程序时间轴组件,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2022-05-05