JS遍历数组的十五种方法
一、循环遍历
for循环,也是最常见的。
可以使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。
二、for of遍历
三、for in遍历
四、forEach()遍历
这种方法只是使处理需要循环的数组变得更加容易,因为你不必像通常那样写出笨重而长的for循环语句。
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数,没有返回值,原数组不变。
forEach() 对于空数组是不会执行回调函数的。
注意和map方法区分。
五、map()映射遍历
map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,并没有改变原来的数组。
map() 方法按照原始数组元素顺序依次处理元素。
注意:map() 不会对空数组进行检测。
六、filter()过滤遍历
将所有元素进行判断,将满足条件的元素作为一个新的数组返回, 原数组不变。
注意:filter() 不会对空数组进行检测。
七、find()遍历
数组中的每个元素都调用一次函数执行。
当数组中的元素在测试条件时返回true,find()返回符合条件的元素,之后的值不会再执行函数;如果没有符合条件的元素则返回undefined,原数组不变。
注意::find() 对于空数组,函数是不会执行的。
八、findIndex()遍历
遍历数组,找到第一个符合条件的元素,并返回该元素;否则,返回-1。
不改变原数组。
九、indexOf()遍历
从前往后遍历数组,找到第一个符合条件的项,并返回该项。否则返回-1。
不改变原数组。
字符串也有此方法,功能类似。
十、lastIndexOf()遍历
从后往前遍历数组,找到第一个符合条件的项,并返回该项。否则返回-1。
不改变原数组。
字符串也有此方法,功能类似。
十一、every()遍历
将所有元素进行判断,返回一个布尔值,原数组不变。
如果所有元素都满足判断条件,则返回true,否则为false。
注意:every() 不会对空数组进行检测。
十二、some()遍历
将所有元素进行判断, 返回一个布尔值, 原数组不变。
如果存在元素满足判断条件,则返回true,若所有元素都不满足判断条件,则返回false。
判断条件注意和every方法区分。
十三、reduce高阶函数(迭代(累加器))
十四、reduceRight()遍历
接收一个函数作为累加器(accumulator),数组中的每个值(从右到左)开始缩减,最终为一个值。
第二个参数作为第一次调用的a的值。
十五、遍历器机制
截止到ES6,JavaScript 已经拥有了数组、对象、Map集合和Set集合这样四种数据结构。
为了统一和简化遍历这四种数据结构的操作,ES6引入了遍历器机制。
ES6 规定,可遍历的对象都具有Symbol.iterator 属性,这个属性指向一个函数,就是当前对象默认的遍历器生成函数。
这个遍历器生成函数大致的模样可以用ES5 语法模拟出来:这个函数返回一个next() 方法,每调用next() 方法,都会返回数据结构的当前成员的信息。
具体来说,就是返回一个包含value和done两个属性的对象。
其中,value属性是当前成员的值,done属性是一个布尔值,表示遍历是否结束。
在ES6 中,已经默认为绝大多数內建的数据结构提供了遍历器,不需要自己去创建。
每个数据结构都有一个默认的遍历器,例如数组的默认遍历器是values(),在没有明确指定遍历器的情况下,这些数据结构都会使用默认的遍历器。
我们可以通过检测对象的Symbol.iterator属性来判断对象是否拥有遍历器。
原生具备遍历器的对象:
数组、Map集合、Set集合、字符串、arguments和 NodeList(节点列表)。
对象(Object)默认是不可遍历的,我们可以通过Object.keys()、Object.values()和Object.entries() 方法把对象变成数组,使其拥有遍历器;或者直接为对象添加Symbol.iterator 属性来自定义遍历器。