for in 和for of的区别(遍历数组与对象方法的总结)

1、遍历数组的方法

1.1 for(var i=0;i<arr.length;i++){}

1.2 Array.forEach()方法

var arr = ['Tony','July' ]
arr.forEach(function(item,index){
    console.log(index,item)
})
arr.forEach(function(item,index){
    console.log(index,item)
})
// 0 "Tony"
// 1 "July"

forEach无法使用break跳出循环,可以通过try…catch…扔出错误来实现跳出循环,例子如下:

var arr = [1,3,5,7,9];
try {
     arr.forEach(function (curItem, i) {
         if(curItem === 1) return;
         console.log(curItem)
         if (curItem === 7) {
             throw Error();         //满足条件,跳出循环
         }
     })
 } catch (e) {  }

1.3 for of 循环、for of循环
二者区别

  • for of遍历的是数组元素值, 而 for in 遍历的是数组的索引(即键名)
  • for of遍历的只是数组内的元素,而for in 遍历的不只是数组内的元素,还有其新增的原型属性和索引

for of 遍历

Array.prototype.method=function(){
  console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="数组";
for (var value of myArray) {
  console.log(value);
}
//只输出1,2,4,5,6,7

for in 遍历

Array.prototype.method=function(){
  console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="数组";
for (var value in myArray) {
  console.log(value);
}
// 输出1,2,4,5,6,7,method,name

2、遍历对象的方法

2.1、 for in来遍历对象的键名,同时也会遍历到原型方法和属性,可以通过hasOwnPropery方法判断某属性是否是该对象的实例属性

Object.prototype.method=function(){
  console.log(this);
}
var myObject={
  a:1,
  b:2,
  c:3
}
for (var key in myObject) {
  if(myObject.hasOwnProperty(key)){    // hasOwnProperty() 可以把该对象的原型方法和属性过滤掉,即把method过滤掉
    console.log(key);
  }
}

在这里插入图片描述

2.2、Object.keys(对象),将对象转换为数组再遍历

var myObject={
  a:1,
  b:2,
  c:3
}
Object.keys(myObject).forEach((item,index)=>{
      console.log(myObject[item]);
})
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页