迭代与循环

2018-01-26

原始的循环

var a = ["1", "2","3"];
for(var i = 0 ; i <a.length; i++){
	console.log(a[i]);
}

forEach

ES5中数组的内置遍历方法

forEach() 方法对数组的每个元素执行一次提供的函数。

 array.forEach(callback(currentValue, index, array){
    //do something
}, this)
 array.forEach(callback[, thisArg])

参数

callback

为数组中每个元素执行的函数，该函数接收三个参数：

currentValue(当前值)

数组中正在处理的当前元素。

index(索引)

数组中正在处理的当前元素的索引。

array

forEach()方法正在操作的数组。

返回值

undefined.

不能使用break来退出循环, 不能使用return语句来返回到外层

for in && for of

for in

for…in语句以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性，语句都会被执行。

1	for (variable in object) {...}

variable

在每次迭代时，将不同的属性名分配给变量。

object

被迭代枚举其属性的对象。

使用hasOwnProtoptype方法可以过滤继承属性。

var otherThing = {d:4,e:5};
function obj(){
  this.a=1;
  this.b=2;
  this.c=3;
}
obj.prototype = otherThing;
var obj2 = new obj();
for(var s in obj2){
if(obj2.hasOwnProperty(s)){
	console.log(`obj2.${s}=${obj2[s]}`)	
}
}

for of

for…of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句。

1
2
3

for (variable of iterable) {
    //statements
}

variable

在每次迭代中，将不同属性的值分配给变量。

iterable

可枚举其枚举属性的对象。

结论

推荐遍历对象属性的时候使用for...in，在遍历数组的时候使用for...of。
for...in 循环出的是key ，for...of 循环出的是value。
for...of不能循环普通对象，需要Object.keys()搭配使用。

若使用for in 遍历数组，顺序可能是随机的。作用于数组的for-in循环除了遍历数组元素以外,还会遍历自定义属性,举个例子,如果你的数组中有一个课枚举的类型a.name,那么循环将额外执行一次,遍历到名为name的索引,甚至数组原型链上的属性都能被访问到