JS迭代（遍历）问题专题整理

**

JS中有各种各样的对象需要迭代（循环），包括Object、String、Array、Set、Map以及各种类数组对象(arguments等等)，而如此多的迭代对象自然会有众多的迭代方法。如何正确的使用迭代就会成为一个难题。因此在这里对迭代相关方法进行整理。

**
一.ES5迭代（以数组为例）

1.底层循环迭代

• for/while/do-while/for-in(仅举例for循环)

var arr = [1,2,3,4,5]
for(var i = 0;i<=arr.length-1;i++){
	var item = arr[i]
}
console.log(item);

通过例子可以看出，该类方法实则是通过遍历数组的索引来达到迭代值的功能的。

2.ES5提供的原型链方法

• forEach

var arr = ["terry","lerry","tom"];

arr.forEach(function(item,index,arr){
    console.log(item,index,arr);
})

使用ES5提供的forEach方法可以不再使用底层循环，而是通过回调函数的方式来进行迭代。

二.ES6迭代（以数组为例）

1.迭代器迭代

• iterator

let arr = [
	{name:"terry", gender:"male"},
	{name:"larry", gender:"male"},
	{name:"vicky", gender:"female"}
]
let k_iterator = arr.keys();
// 如何利用k_iterator获取arr中的每个元素
let item ;
while(!(item = k_iterator.next()).done){
	let key =item.value;
	let val = arr[key];
	console.log(val);
}

ES6提供的Generator函数会在数组调用.keys()、.values()、entries()方法时，声称一个迭代器，通过采用.next()方法调用迭代器来达到迭代数组的效果。

2.for-of方法

• for-of

  1）使用for-of协助遍历迭代器

let iterator = array.values();
for(let v of iterator){
	console.log(v);
}

2）使用for-of直接遍历可以迭代数组

for(let v of array){
	console.log(v);
}

不难看出，对于一个数据量较小的可迭代对象，使用底层方法往往是最简单的。当然，在实际开发中数据量过于庞大，这时候借用ES6提供的迭代方法会大大减少我们的工作量。