for...in和for...of循环以及forEach方法

用Es6对象扩展运算符（…）与rest运算符说明

function test(first,...a){

    for(let val=0; val<a.length;val++){

        console.log(val+' '+'常用的 for循环') // 0-6 便利出下标

    }

    for(let val in a){

        console.log(val+' '+ 'for in  0-6 便利出下标') // 0-6 便利出下标

    }

    for(let val of a){

        console.log(val+' '+ 'for of 2-8 便利值') //2-8 便利值

    }

}

test(1,2,3,4,5,6,7,8)

补充一个可以用for of 同样能实现for in效果的方式

for…of数组索引:有时候开发中是需要数组的索引的，那我们可以使用下面的代码输出数组索引。

let arr=['xzblogs','小智','zachary']

for (let index of arr.keys()){

    console.log(index);

}
可以看到这时的控制台就输出了0,1,2，也就是数组的索引。

用for of还可以同时输出对应的索引值和对应的内容，也就是键值对

我们用entries()这个实例方法，配合我们的for…of循环就可以同时输出内容和索引了。

let arr=['xzblogs','小智','zachary']

for (let [index,val] of arr.entries()){

    console.log(index+':'+val);

}

一、循环

1、for...in循环：可以把一个对象的所有属性依次循环出来。

var o ={
name:"jack",
age:20,
city:"beijing"
};
for (var key in o){
alert(key)  //"name","age","city"
} 

由于Array也是对象，而它的每个元素的索引被视为对象的属性，因此，forj...in循环可以直接循环出Array的索引。

var a =["A","B","C"];
for (var i in a){
alert(i);       //"0","1","2"
alert(a[i]);   //"A","B","C"
}

总结：for...in循环的是对象的属性；所以便利数组得到的是索引而不是值；所以要遍历数组，可以采用下标循环。

        for...in对Array的循环得到的是String而不是Number。

2、for...of循环：ES6标准引入了新的iterable类型，Array、Map和Set都属于iterable类型；

                      具有iterable类型的集合可以通过for...of循环来遍历;

                      只循环集合本身的元素。

用for...of循环遍历集合，用法如下：

var a = ["A","B","C"];
var s = new Set(["A","B","C"]);
var m = new Map([[1,"x"],[2,"y"],[3,"z"]]);
for (var x of a){
alert(x);
}
for (var x of s){
alert(x);
}
for (var x of m){
alert(x[0]+"="+x[1]);
}

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

以Array为例

var a =["A","B","C"];
a.forEach(function(element,index,array)){
//element:指向当前元素的值
//index:指向当前元素索引
//array:指向Aaary对象本身
alert(element);
} 

Set与Array类似，但Set没有索引，因此回调函数的前两个参数都是元素本身；

Map的回调函数参数依次是value、key和map本身。

二、rest参数

ES6引入了rest参数。看下面函数：

function foo(a,b,...rest){
console.log("a="+a);
console.log("b="+b);
console.log(rest);
}

foo(1,2,3,4,5);
//结果
//a=1
//b=2
//Array[3,4,5]

foo(1)
//结果
//a=1
//b=undefined
//Array[]

rest参数只能写在最后，前面用...标识。从运行结果可知，传入的参数先绑定a、b，多余的参数以数组形式交给变量rest。

如果传入的参数连正常定义的参数都没有填满，rest参数会接收一个空数组（注意不是undefined）。

三、求和sum()函数

1、用rest参数和for...of循环   　

function sum(...rest){
var result=0;
if (rest.length==0){
return 0;
}
for (var i of rest){
result+=i;
}
return result;
} 

2、for 循环

function sum(...rest){
var result=0;
if (rest.length==0){
result=0;
}
for (var i=0;i<rest.length;i++){
result+=rest[i];
}
return result;
}

3、用iterable类型的forEach方法

function sum(...rest){
var result = 0;
if(rest.length==0){
result=0;
}
rest.forEach(function(element){
result+=element;
})
return result;
}