JavaScript forEach遍历数组

JavaScript forEach遍历数组教程

JavaScript数组 对象内置了 forEach 方法,可以用来遍历数组,同时,forEach 方法遍历数组时还提供了一个回调函数,每次遍历,都会自动调用该回调函数。

JavaScript forEach详解

定义

forEach() 方法为每个数组元素调用一次函数(回调函数)。

语法

array.forEach(function(currentValue, index, arr), thisValue);

参数

参数 描述
function(currentValue, index, arr) 必须。数组每个元素需要执行的函数。
thisValue 可选。 传递给函数的值一般用 “this” 值。
如果这个参数为空, “undefined” 会传递给 “this” 值

function参数

参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引
arr 可选。当前元素所属的数组对象

技术细节

该函数只支持 ECMAScript 3 即以上版本。

案例

forEach循环遍历数组元素

使用 forEach 循环遍历数组的每一个元素

<!DOCTYPE html> <html> <head> <title>JavaScript forEach循环遍历数组的每一个元素</title> <script type="text/javascript"> console.log("嗨客网(www.haicoder.net)"); var arr = new Array("Hello", "HaiCoder", "Hello", "JavaScript"); function walk(value, index, array){ console.log("Call Walk, Index =", index, "Value =", value); } arr.forEach(walk); </script> </head> </html>

程序运行后,控制台输出如下:

24_Javascript forEach循环遍历数组.png

我们首先定义了一个函数 walk,该函数接受三个 参数,与 forEach 的回调函数对应,接着,我们调用数组 arr 的 forEach 方法,并传入我们定义的 walk 方法实现遍历数组。

我们看到,数组中的每个元素,都打印了索引和元素值,即,数组的 forEach 方法对数组的每个元素都调用了 walk 方法。

forEach循环遍历数组元素

使用 forEach 循环遍历数组的每一个元素

<!DOCTYPE html> <html> <head> <title>JavaScript forEach循环遍历数组的每一个元素</title> <script type="text/javascript"> console.log("嗨客网(www.haicoder.net)"); var arr = new Array("Hello", "HaiCoder", "Hello", "JavaScript"); function walk(value){ console.log("Call Walk, Value =", value); } arr.forEach(walk); </script> </head> </html>

程序运行后,控制台输出如下:

25_Javascript forEach循环遍历数组.png

如果我们仅仅希望使用数组的元素,而不需要数组的索引,那么我们的回调函数可以仅仅传入一个参数,即数组元素的值。

JavaScript forEach遍历数组总结

JavaScript 的数组对象内置了 forEach 方法,可以用来遍历数组,同时,forEach 方法遍历数组时还提供了一个回调函数,每次遍历,都会自动调用该回调函数。JavaScript forEach 语法:

array.forEach(function(currentValue, index, arr), thisValue);