JS数组遍历方法集合

就让我们在逆战中成长吧,加油武汉，加油自己

1.for循环

使用零时变量将长度存起来，当数组较大时优化效果才会比较明显。

var ar1=[2,4,6,8]

for(var i=0;i<ar1.length;i++){

    console.log(i)
　　console.log(ar1[i])

}

2.foreach循环

遍历数组中每个数，没有返回值

使用break不能中断循环，使用return也不能返回到外层函数

var ar1=[2,4,6,8]

ar1.foreach((item,index,arr){

    //第一个参数代表当前元素

    //第二个参数代表当前元素下标

    //第三个参数代表原数组

})

//数组中长度多少就循环多少次

3.for-of循环

运行循环获得键值

var ar1=[2,4,6,8]

for(var i of ar1){

    console.log(i)

    //2,4,6,8

}

for-of可用使用break，continue 和 return 配合使用，跳出循环

for(var i of ar1){

    if(i==4){

        break

    }

    console.log(i)//

}

对于普通对象直接遍历的话是会报错的 obj is not iterable

for-of循环不支持普通对象，但如果你想迭代一个对象的属性，你可以用for-in循环（这也是它的本职工作）或内建的Object.keys()方法：

可以使用 Object.keys(obj) 方法将对象的键名生成一个数组，然后遍历这个数组

var obj={

        "naem":"张三",

        "age":18

    }

    for(var i of Object.keys(obj)){

        console.log(i+":"+obj[i])

        //name:张三  age:18

    }

4.for-in

只能获得对象的键名，不能获得键值

var obj={

        "naem":"张三",

        "age":18

    }

for(var i in obj){

        console.log(i)

        //name

        //age

    }

for...in 循环不仅遍历数字键名，还会遍历手动添加的其它键，甚至包括原型链上的键。for...of 则不会这样

let arr = [1, 2, 3]

arr.set = 'hello'  // 手动添加的键

Array.prototype.name = 'word'  // 原型链上的键

for(var i in arr) {

  console.log(i)

//

//

//

//set

//name

}

for-in是为遍历对象而设计的，不适用于遍历数组。(遍历数组的缺点：数组的下标index值是数字，for-in遍历的index值"0","1","2"等是字符串)

5.map

不会改变原数组，有返回值可用return，成为一个新数组（只是相当于把原数组克隆一份，把克隆的这一份的数组中的对应项改变了）

var ar1=[2,4,6,8,12]

var map1=ar1.map((item)=>{

    if(item==6){

        return item*2

    }

})

console.log(map1)

//[undefined, undefined, 12, undefined, undefined]

之所以会出现undefined，是因为map()方法创建了一个新数组，但新数组并不是在遍历完array1后才被赋值的

下面这样写才是正确的

var map1=ar1.map((item)=>{

    if(item == 6){

        return item * 2

    }

    return item

})

console.log(map1)

//[2，4,12,8,12]

5.filter

不会对原数组进行修改返回新数组

 var filt=ar1.filter((item,index)=>{

     //返回索引大于2的元素组成新的数组

    if(index>2){

        return item

    }

 })

 console.log(filt)

 //[8,12]

6.reduce

reduce()作为一个循环使用。接收四个参数：初始值（上一次返回值），当前元素值，当前元素下标，原数组。

var a=[4,5,6,7,8]

//item代表一次回调的值 初始值为0

//cart代表当前元素的值

//index当前下标

//arr原数组

var num=a.reduce((item,cart,index,arr)=>{

    return item+=cart

},0)

//初始值为0

console.log(num) //输出为30

7.some

every()与some()方法都是JS中数组的迭代方法。

some()是对数组中每一项运行给定函数，如果该函数满足任一项返回true，则返回flase

var a=[1,2,4,69,56,89]

var some1=a.some((item)=>{

return item > 50

})

console.log(some1)//true

8.every()