浅谈js中的遍历

遍历是程序中必不可少的一环，在所有语言中都存在，因为它可以简化人们的规律性操作，本文将一一道来。

for++

这是最基础的for循环语句，格式如下：

    var arr = [1, 2, 3, 4, 5]
    for (var i = 0; i < arr.length; i++) {
        console.log(i)
        if (i > 2) break
    }

也有人这样写,据说效率更高

    for (var i = 0, len = arr.length; i < len; i++) {
        console.log(i)
        if (i > 2) break
    }

while

for循环可以同时拿到每个循环的索引和数组对应的项，如果只是满足一定条件内的循环，可以使用while 。

    var i = 0
    while (i < 5) {
        console.log(i)
        if(i>2)break
        i++
    }

forEach, map, filter

上述方法写起来略微麻烦，所以es5新增了几个对数组的遍历方法，此外还有every,some,reduce，不过不是很常用。这几个方法会完整地遍历数组，即使在满足条件return后，循环依旧进行。
用法如下：

// forEach 直接遍历
arr.forEach((item, index) => {
        console.log(item, index)
    })
    
// map 依次遍历，对每一项进行转换，映射成另一个数组
const arr1 = arr.map((item, index) => {
        return item * 2
    })
console.log(arr1) // [2,4,6,8,10]

// filter 依次遍历，过滤得到满足条件的项，组成数组
const arr2 = arr.filter((item, index) => {
        return item % 2 == 0
    })
console.log(arr2) // [2,4]

for...of

这个是es6推荐的数组遍历方法，相比forEach，优点有2点：
1.可以使用break和continue跳出循环
2.找到满足条件的项，跳出循环后，后面的循环不会进行，从而减少内存消耗。

for (const item of arr) {
        console.log(item)
        if (item > 2) break
    }
    
// 如果要同时遍历索引和项
for (const [index, item] of arr.entries()) {
        if (index === 2) {
            console.log(item)
            break
        }
    }   

for...in

上述都是遍历数组的方法，这个是遍历对象的方法，并且最好不要混用

const obj = {
        a: 1,
        b: 2,
        c: 3
    }
for (const key in obj) {
    console.log(key, obj[key])
}