普通的for循环&for...in&for...of&forEach

普通的for循环

        function test(first, ...a) {
            for (let i = 0; i < a.length; i++) {
                console.log(i)
            }
        }
        test(1, 2, 3, 4, 5, 6, 7, 8)

打印出来的结果：

分析：0-6 遍历出下标

for…in

        function test(first, ...a) {
            for (let i in a) {
                console.log(i)
            }
        }
        test(1, 2, 3, 4, 5, 6, 7, 8)

打印出来的结果：

分析：0-6 遍历出下标

for…of

        function test(first, second, ...a) {
            for (let i of a) {
                console.log(i)
            }
        }
        test(1, 2, 3, 4, 5, 6, 7, 8)

打印出来的结果：

分析：遍历的是3-8的值

补充一个可以用for of 同样能实现for in效果的方式，
for…of数组索引:有时候开发中是需要数组的索引的，那我们可以使用下面的代码输出数组索引。

        let arr = ['刘备', '关羽', '张飞']
        for (let index of arr.keys()) {
            console.log(index);
        }

打印出来的结果：

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

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

        let arr = ['刘备', '关羽', '张飞']
        for (let [key, val] of arr.entries()) {
            console.log(key + ':' + val);
        }

打印出来的结果：

一.循环

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

        var message = {
            name: "刘备",
            age: 20,
            city: "beijing"
        };
        for (let key in message) {
            console.log(key)
        }

打印出来的结果：

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

        var a = ['刘备', '关羽', '张飞'];
        for (let i in a) {
            console.log(i);
            console.log(a[i]);
        }

总结：for…in循环的是对象的属性；所以遍历数组得到的是索引而不是值；所以要遍历数组，可以采用下标循环。 for…in对Array的循环得到的是String而不是Number。比如上面的console.log(a[i]) ，它循环得到的是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对象本身
            console.log(element);
            console.log(index);
            console.log(array);
        })

Set与Array类似，但Set没有索引，因此回调函数的前两个参数都是元素本身；Map的回调函数参数依次是value、key和map本身（和Array一样）。

        var s = new Set(["A", "B", "C"]);
        s.forEach(function(param1, param2, param3) {
            //param1:指向当前元素的值
            //param2:指向当前元素的值
            //param3:指向Aaary对象本身
            console.log(param1);
            console.log(param2);
            console.log(param3);
        })

二、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;
        }
        var a = sum(1, 2, 3)
        console.log(a) //6

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;
}