前言

遍历数组的方法，你能想出来几种，今天小落落就跟你一起缕一缕，我们大前端对于遍历数组的方法。我数了一下，大概有十四种，你能想到几种？

我根据名字做个分类

for系列

1. for

这可能是我们最常用的，因为我们初学时，可能接触的就是普通的for循环,以下的书写方式
语法

for(语句1;语句2;语句3){
  语句块
}

在for循环中，有三个语句，分别代表的含义：
语句1：定义变量最初的值，在循环开始之前执行。
语句2：变量结束时的值，也就是运行循环的条件。
语句3：循环一次，变量增加或减少的量。每次循环结束后执行。

知识

1. for循环的三个语句条件都可可省的，如果三个条件都缺少，但是分隔符不能少。如果三个语句条件都没有，表示是一个死循环，只有在循环体内才能结束循环。
   我们也称此类循环为空循环，可以用来做延迟功能。

       var i = 0;
       for(;;){
           if(i==4) break;
           i++;
       }

2. for循环性能优化
   在使用for进行数组遍历时，可以先将数组长度进行缓存，从而减少计算长度次数。如下

   for(var i=0,len = arr.length;i<len;i++){
       语句块
   }

2. for in

for in 比for有了一个更强大的功能，它可以循环遍历对象，不单单遍历一个数组。

    var obj = {
      name:'test',
      age:18,
      sex:'girl'
    }
    for(var x in obj){
        console.log(`${x}:${obj[x]}`)//输出name:test,age:18,sex:girl 
    }

知识

1. 由于for in遍历的是对象的属性，所以，他遍历出来的值是字符串型的，并不能直接进行数值计算。
2. for in 可以循环到原型链上的属性,所以尽量不使用for in遍历数组，如下
   
   我们在数组的原型是添加了一个函数，导致，我们在遍历一个普通数组时，都会在结果处输出。
3. for in 只遍历可枚举类型。像Array和Object使用内置构造函数所创建 的对象都会继承Object.prototype和String.prototype的不可枚举属性。例如String的indexOf()方法，或者Object的toString方法。它会遍历对象本身以及对象原型上所有的可枚举属性。

3. forEach

forEach是数组自带的一个方法，它可以不需要数组长度，开始对数组进行循环。~~~~
支持箭头函数
语法

var arr = [1,2,3,4,5];
arr.forEach((item,index)=>{
    console.log(item,index)
})

item 就是遍历的数组元素，index元素的下标

forEach与其它的for系列的使用方法不同，因为它是属于数组自带的一个方法，所以用. 点的形式调用

知识

1. forEach你可以认为它是一个比较执拗的方法，因为他一旦要执行，就不能被中断，break或者return语句都不能退出，它必须要执行完，才可以。且，在forEach方法中使用break会报错。
2. 不会改变原数组

4. for of

for of是ES6新增的一种遍历方式，它提供了统一的遍历机制.
语法

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

它的语法与for in还是蛮像的，有些小伙伴这两个有时候会傻傻分不清楚，小落落也是这样的。

那这两个有什么不同呢

知识

1. for of 可以遍历的对象：Array、Map、Set、String、Argumentst等

   for in 可遍历的对象：除Symbol以外的可枚举属性。

2. for of 不能遍历到原型链
3. for of 可以使用break、continue、return终止循环遍历。

while系列

1. while

语法

while(n<3){
    语句体
}

while我们可以看到，它是先判断条件的，如果条件不满足，语句体是不会被执行的。
可以使用break、continue、return终止循环。

2. do while

语法

do{
    语句体
}while(n<3)

do while与while最大的不同，就是先执行一次语句体，再去做判断。

reduce系列

哈哈哈哈哈，我觉得这个系列，属于小落落的装逼系列。因为像我这等小菜鸡，之前reduce是什么，是万万不知道的。别说还有一个reduceRight。

但其实，所有你没见过的知识，只要你去一点点的了解它，都不会那么可怕。

1. reduce

语法
array.reduce(function(total,currentvalue,currentIndex,arr),initialValue)
total:第一个值是必选的，他代表了初始值，或者是计算结束后的返回值。
currentValue:也是必选的。表示当前的数组元素。
currentIndex:可选的。表示当前的数组元素下标。
arr:可选。表示当前的数组。
initialValue:设置total的初始值。默认值为1

var arr = [1,2,3,4,5,6];
arr.reduce((total,current)=>return ,3)

2. reduceRight

reduceRight与reduce一样，唯一不同的是，reduceRight是从右往左开始计算。reduce是从左往右计算。

find系列

1. find

语法
find()方法返回数组中满足条件的第一个元素。

arr.find(callback(element, index, array){
    语句体
}, this)

用法

var arr = [1,2,3,4,54,5]
var result = arr.find((item,index,arr)item>4)
result//输出54

2. findIndex

find与findIndex语法和用法都是一样的，find是查找的元素，findIndex是查找的元素位置

var arr = [1,2,3,4,54,5]
var result = arr.findIndex((item,index,arr)item>4)
result//输出4

其它系列

1. map

语法
map与forEach一样，也是数组自带的方法，所以使用.点的形式调用。

arr.map(callback(element, index, array){
    语句体
}, this)

callback 表示回调函数
element：数组元素
index:元素下标
array:当前正在遍历的数组本身
this:回调的this指向
知识

1. 不会改变原数组，但是会返回一个经过处理后的新数组。
2. map中可以使用return终止循环

用法

var result = arr.map(function(item,index,arr){
    console.log(item)
})

2. filter

语法
filter的用法与map是一样的

arr.filter(callback(element, index, array){
    语句体
}, this)

知识*

1. filter不会改变原来的数组
2. 它主要起过滤的作用。它会将满足条件的数组元素组合成一个新的数组，然后作用返回值。

用法

var result = arr.filter(function(item){
    if(item<=4){
        return item;
    }
})
//箭头函数的写法，恩~简洁
var result = arr.filter((item)=>item<=4)

3. every

语法
好巧哇，又是一样的写法

arr.every(callback(element, index, array){
    语句体
}, this)

every根据字面意思，我们可以理解为每一个。意思是说，只有数组元素中的每一个为true,结果才会为true.只要发现有一个为false,结果就是false.
知识

1. 同样every也不会改变原数组。
2. 如果回调函数传入的是空数组，返回值一定是false

4. some

语法
好巧哇，又双是一样的写法

arr.some(callback(element, index, array){
    语句体
}, this)

some和every在这里相当于一对反义词。some的直译过来是一些。套在这里，只要有一个为true,返回值就为true.
知识

1. some找到一个为true的，就会立即返回true.
2. some也不会改变原数组。

总结

我们总结了这么多关于遍历数组的方法，其实从用法和语法上，我们也能看能将这些方法统一归类

数组中的方法

其它方法

参考链接

[https://www.cnblogs.com/wangx…]
MDN