js for in循环 for of循环的区别以及用法

1.for in

用法 ： 用于遍历对象，数组和字符串的的key

代码体现：

  <script>
        var arr = [1,2,3,4,5,6];
        for(let Aarry in arr){
            console.log(Aarry);  //获取索引  0，1，2，3，4，5，6
            console.log(arr[Aarry]);  //获取索引对应值  1，2，3，4，5，6
            console.log(arr+arr); // 无法参与运算  被拼接 1，2，3，4，5，61，2，3，4，5，6
        }
    </script>

• for in 获取的下标为字符串类型，无法参与集合运算
• 遍历顺序有可能不是按照实际数组的内部顺序
• 会遍历数组的所有可枚举的属性 包括原型的方法

    Array.prototype.method=function(){
              console.log("hellow");
          }
          Array.prototype.hes = "你好"
          var arr = [1,2,3,4,5,6];
          for(let Aarry in arr){
              console.log(Aarry);  //获取索引和可枚举属性  0，1，2，3，4，5，6 ,methods,hes
             
          }

•  通常需要配合hasOwnProperty()方法判断某个属性是否该对象的实例属性，来将原型对象从循环中剔除。

 <script>
        Array.prototype.method=function(){
            console.log("hellow");
        }
        Array.prototype.hes = "你好"
        var arr = [1,2,3,4,5,6];
        for(let Aarry in arr){
            if(arr.hasOwnProperty(Aarry)){
                console.log(Aarry);  //获取索引  0，1，2，3，4，5，6  
            }
          
    
        }
    </script>

 故一般用for in 遍历对象而不用来遍历数组

2.for of

用法 ： 用于遍历数组和字符串的的值  不能遍历对象

代码体现：

    <script>
        var obj = {
            name:"张三",
            age:"15",
            sex:"男"
        }
        for(let self of obj){
            console.log(self);//报错  因为对象不具备可遍历接口
        }
    </script>

• 如果硬要遍历普通属性 可以用for in循环 或者内建的Object.keys()方法
• Object.keys()获取对象实例属性组成的数组，不包括原型方法和属性

     var obj = {
            name:"张三",
            age:"15",
            sex:"男"
        }
        for(let self of Object.keys(obj)){
            console.log(self+":"+obj[self]); // 
        }
    </script>

但是，我感觉是多次一举

• 遍历数组

    <script>
       var a = [1,2,3,4,5,6,7]
       for(let arr of a){
        console.log(arr); //获取的是数组值 不是下标
       }
    </script>

foreach函数也可以做到 但是函数中无法出现 return countine break语句 但是for of可以

for in 遍历对象

for of 遍历数组