js遍歷陣列的幾種方法

第一種：for迴圈，也是最常見的

for (let i = 0; i < arr.length; i++) {
            console.log(arr[i])
        }

第二種：forEach（）

1)、forEach（）遍歷普通陣列

arr.forEach( function(item){
            console.log(item)
        } )

2）、forEach（）遍歷物件型別陣列

const arr = [
            {id:1,name:'zhangsan'},
            {id:2,name:'lisi'},
            {id:3,name:'wangwu'}
        ]

arr.forEach( function(item){
            console.log(item.id + '---' +  item.name)
        })

輸出結果：

第三種： map（）方法

map即是 “對映”的意思 ，原陣列被“對映”成對應新陣列

var newArr = arr.map( function(value,index){
console.log(value + '---' + index)
return value + 10
})

console.log(newArr)

輸出結果：

注意：forEach（）和map（）區別：

1、forEach：用來遍歷陣列中的每一項，這個方法執行沒有返回值，不影響原陣列

2、map：支援return，相當與原陣列克隆了一份，把克隆的每項改變了，也不影響原陣列

第四種： for....in 方法

for....in 是es5標準， 此方法遍歷陣列效率低，主要是用來迴圈遍歷物件的屬性

1)、 for......in 遍歷陣列

for(let item in arr){
            console.log(arr[item])
        }

2)、for.....in 遍歷物件

迴圈遍歷物件的屬性，js中動態獲取key，得到某物件中相對應的value = obj[key]

const obj = {
            a:1,
            b:2,
            c:3
        }

for(let key in obj){
            console.log(key + '---' + obj[key] )
        }

輸出結果：

第五種： for.......of 方法 （es6支援）

for(let item of arr){
            console.log(item)
        }