前端几种常见的遍历方法

1. for in

for in肯定是接触比较多的遍历数组的方法，vue里面经常使用，其实它也可遍历对象（遍历字符串也是可以的！）实例演示一下：
遍历数组

    var arr = ['a', 'b', 'c', 'd'];
    for (var key in arr) {
        console.log(arr[key] + '---' + key);//key是遍历后的索引
    }

返回结果

遍历对象

 var obj = {
        name: '小王',
        age: '22',
        sex: '男',
    }
    // 遍历对象  key是属性  obj[key]是属性值
    for (let key in obj) {
        console.log(obj[key] + '---' + key);
 
    }

遍历字符串跟数组一样就不展示了

2. map（）

array.map() 是一个经常使用的遍历数组的方法

var arr = [1,3,4,7,9,5]
arr.map ((res,index) => {
 console.log(res,index)// res是数组中的每个元素，index是该元素在数组中的索引
})

返回结果

3. forEach()

forEach()遍历方法写法跟map()方法一样，但是还是有很多区别的

1. map 对数组的每一项进行加工，加工完成之后返回一个新的数组, 而forEach 只是简单的进行循环， 没有返回值，不可对他加工
2. 性能方面map 比 forEach 执行时间短
3. 创建一个新的数组时建议使用map，不需要制作一个新的数组，而是要对数据做一些事情时，就使用forEach
   代码如下

var arr = [1,3,4,7,9,5]
arr.forEach ((res,index) => {
 console.log(res,index)// res是数组中的每个元素，index是该元素在数组中的索引
})

返回结果：

4. for of （ES6）

res就是数组中的每个元素，for of 遍历可迭代数据，不能遍历对象！！！

 var arr = ['a', 'b', 'c', 'd'];
    // 遍历数组  key是索引
    for (let res of arr) {
        console.log(res);//输出a  b   c   d
    }

这些都是一些常用简单的遍历方法，还有一些for和while循环就不推荐使用了，还有一些数组的方法也具备遍历的能力，比如find(),filter()等，有兴趣可以看看文档