JavaScript 学习笔记7_iterable_20181206

/**********************************************************************
** author		: Bugliu
** date			: 2018-12-06
** description		: iterable
** 学习网站		: www.liaoxuefeng.com
**********************************************************************/

/*
遍历Array可以采用下标循环，遍历Map和Set无法使用下标。为了统一集合类型，
Array、Map和Set都属于iterable类型。具有iterable类型的集合可以通过新的
for ... of循环来遍历
*/

var a = ['a', 'b', 'c'];
var s = new Set(['1', '2', '3']);
var m = new Map([ [1, 'x'],[2, 'y'],[3, 'z'] ]);

// 遍历数组
for( var tmp of a )
{
	console.log( tmp );
}	

// 遍历set
for( var tmp of s )
{
	console.log( tmp );
}	

// 遍历map
for( var tmp of m )
{
	console.log( tmp );
}

/*
 for...of 与 for...in的区别
 for ... in循环由于历史遗留问题，它遍历的实际上是对象的属性名称。一个
 Array数组实际上也是一个对象，它的每个元素的索引被视为一个属性。
 当我们手动给Array对象添加了额外的属性后，for ... in循环将带来意想不
 到的意外效果. 
*/
a.name = 'hello';
for( var tmp in a )
{
	console.log( tmp );	// 0, 1, 2, name
}

// for...in循环将name包含在内，for...of只循环集合本身的元素
for( var tmp of a )
{
	console.log( tmp );	// a, b, c
}

// 更好的方法是iterable内置的forEach方法，它接收一个函数，每次迭代就
// 自动回调该函数。

// 数组的forEach用法
var a = ['a', 'b', 'c'];
a.forEach(function (element, index, array){
	// element: 指向当前元素的值
	// index：指向当前索引
	// array: 指向array对象本身
	console.log( element + ',index = ' + index );
});

/* 上面function函数中的参数名称不是固定的， 可更换
  a,index = 0
  b,index = 1
  c,index = 2
*/

// set没有索引，回调函数的前两个参数都是元素本身
var s = new Set( ['a', 'b', 'c'] );
s.forEach(function (element,sameElement, set){
	console.log( element );	// a, b, c 
});

// map的回调函数参数依次为value, key , map
var m = new Map([ [1, 'a'],[2, 'b'],[3, 'c'] ]);
m.forEach(function (value, key, map){
	console.log(value);		// a, b, c
});

// js中函数调用不要求参数必须一致，可以忽略,但你所要的参
// 数在参数列表中位置左侧的所有参数都不可省略。
var a = ['a', 'b', 'c'];
a.forEach(function(element){
	console.log(element);	//a, b, c
});

// 可以忽略所有参数
a.forEach(function(){
	console.log(arguments);
});

/* 执行结果
"a", 0, Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ
"b", 1, Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ
"c", 2, Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ
*/