你能想到的前端遍历都在这里了！
前端遍历的存在，极大地简化了我们处理业务数据的繁琐程度。所以熟悉并灵活运用他们可大大地提高我们的效率。下面就一一熟悉他们吧！
01
遍历方法目录
for循环 - 稍许繁琐，可中断（break），可跳过（conttinue）
for-of - 简化for循环，更加灵活，无需索引
for-in - 对象遍历，一般不用于数组遍历
while - 当循环次数不限制、不确定一时使用
forEach - 适合对每个元素执行操作；没有返回值，会改变原数组
some - 返回值为true或者false；只要一个元素满足条件，则返回true
every - 返回值为true或者false；所有元素都满足条件，返回true
filter - 根据指定的条件筛选出数组中满足条件的元素，返回数组或[]
find - 查找满足指定条件的第一个元素，返回元素或undefined
findLast - 查找满足指定条件的最后一个元素，返回元素或undefined
findIndex - 查找满足指定条件的第一个元素索引，返回索引或者-1
findLastIndex - 查找满足指定条件的最后一个元素索引，返回索引或者-1
map - 每个元素的映射，可以为每个元素根据展示要求进行处理
reduce - 求和，求平均数，字符串返转，数组扁平化
reduceRight - 跟上面方法区别就是从后往前遍历
sort - 降序排序，升序排序列；会改变原数组
02
一一拆解
1.for循环
for循环是最早也是最常见的一种遍历。因其写起来稍显繁琐，逐渐被其它遍历方法所取代。但其有一个地位是不可撼动的-可中断循环，这是其它遍历所不不能实现的。所以某些情境五，我们不得不乖乖地来启用这个古老的语法。
示例：
最后一个console是否显示，取决环境前一个{}里的关键记是break还是continue：
break: 跳出循环，可以执行循环体外的代码；输出：2,3,5,大于5不显示,这里显示吗？
continue: 跳出本次循环，继续循环。如此例return换做continue，则输出：2,3,5,大于5不显示,1,这里显示吗？
2.for-of
for-of语句，略过索引，写起来更加简便。使用它可以将每一项元素依次循环出来，还可以将迭代对象循环出来。
迭代对象包括：Array、Set、Map、Arguments、String、Typed Array、Generators这7类。而Object类型不是可迭代对象。
示例：
3.for-in
for in 循环是一种特殊类型的循环，主要用来遍历对象也可以遍历数组（但是不推荐），使用它可以将对象中的属性依次循环出来。
示例：
4.while
在while和do/while里，记得一定要自加或自减，否则会无限循环下去...
while只有当循环条件成立时，才会执行{}里的代码。
语法如下：
示例：
do/while是while的变体。它与 while 循环的不同在于，在检查条件是否为真之前，该循环将会执行一次代码块，然后只要条件为真，它就将重复该循环。
语法如下：
示例：
5.forEach
返回值：undefined;
是否改变原数组：改变原数组。
语法：
数组名.forEach((item, index, array) => { /* … */ }, thisValue)
item：指数组中的每一个元素；
index：指各个元素相对应的索引；
array：指数组本身，一般可以不写。
thisValue : 可选, 对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined";
示例：
6.some
数组中只要有一个元素符合条件就返回true，否则就返回false。
返回值：true | false;
是否改变原数组：不改变原数组。
语法：
数组名.some( (item, index, array) => { /* … */ }, thisValue)
同上...
示例：
7.every
数组中所有元素都符合条件才返回true，否则就返回false。
返回值：true | false;
是否改变原数组：不改变原数组。
语法：
数组名.every( (item, index, array) => { /* … */ }, thisValue)
同上...
示例：
8.filter
查找数组中符合条件的所有元素。
返回值：[] | 符合条件的数组;
是否改变原数组：不改变原数组。
语法：
数组名.filter( (item, index, array) => { /* … */ }, thisValue)
同上...
示例：
9.find
返回符合条件的第一个元素。
返回值：undefined | 符合条件的元素;
是否改变原数组：不改变原数组。
语法：
数组名.find( (item, index, array) => { /* … */ }, thisValue)
同上...
示例：
filter：返回[]或者数组;
find：返回undefined或者查找到的第一个元素
10.findLast
findLast与find类似，惟一区别就是查找顺序-findLast是从右侧往左侧查找，找到最后一个（从前往后数是最后一个，从后往前数是第一个）符合条件的元素。
返回值：undefined | 符合条件的元素;
示例：
11.findIndex
返回符合条件的索引，没有查到则返回-1。
返回值：-1 | 符合条件的元素索引;
示例：
12.findLastIndex
findLastIndex与findIndex类似，唯一区别是筛查顺序。查到到最后一个符合条件的元素的索引。这个索引可是从前往后数的噢！
返回值：-1 | 符合条件的元素索引;
示例：
findLast 和 findLastIndex
是最新提案，目前在微信小程序中不支持，会报错。不知道把小程序升级到最高版是否还会报错。
13.map
map是一种映射。在需要为每一项元素按照指定规则变化时使用。返回新数组。
返回值：undefined | 符合条件的元素;
是否改变原数组：不改变原数组。
语法：
数组名.map( (item, index, array) => { /* … */ }, thisValue)
同上...
示例：
14.reduce
返回值: 最终累积结果：reduce方法返回最终的累积结果，可以是任意数据类型，如数字、字符串、对象或数组。
是否改变原数组: 不改变原数组
语法：
数组名.reduce((prev, cur, index, arr) => { /* … */ }, init)
prev：表示上一次调用回调时的返回值，或者初始值 init;
cur：表示当前正在处理的数组元素；
index：表示当前正在处理的数组元素的索引，若提供 init 值，则索引为0，否则索引为1；
arr : 表示原数组，可不写;
init：初始值，可选项。
当没有传入初始值时，prev是从数组中第一个元素开始的，cur 是数组第二个元素。
但是当传入初始值（init）后,第一个 prev 将是初始值 init，cur 将是数组中的第一个元素。
reduce有多种应用：
应用1-求和：
示例：
应用2-求平均：
求和与求平均类似，求和之后天的返回值再求平均就OK。
示例：
应用3-数组无素最大值和最小值：
求数组中的最大值和最小值，简直不要太简单。直接使用只适合于一维数组。
示例：
应用4-数组扁平化：
只适合一维或二维数组，多维不适合
示例：
15.reduceRight
reduceRight与reduce惟一区别就是迭代方向是从右侧往前。
主要有以下两种应用：
应用1-字符串返转：
首先需要先将字符串转化成数组-reduceRight是对数组的操作。
示例：
应用1-扁平化树结构：
这个应用是某大老发出的，不是很懂。留个记号，以备后用。
16.sort
sort的功能是排序。
返回值: 返回排序后的新数组；
是否改变原数组: 改变原数组
语法：
数组名.sort( (a, b) => { /* … */ })
a, b为前后两个连续的元素。
如果返回值结果小于0，则a和b的顺序不变;
如果返回值结果等于0，则a和b的顺序不变;
如果返回值的结果大于0，a和b会交换位置。
就是根据以上规则进行升序或者是降序排序的。
a - b：升序；
b - a：降序。
示例：
