学习JavaScript 的forEach 循环

164 阅读3分钟

forEach 循环是大多数编程语言中的一种特殊类型的循环,用于循环[数组]中的元素。它主要用于替代 循环,以避免潜在的逐个错误/误差,因为它没有计数器。

为什么我们要使用forEach循环

要使用for循环,我们需要定义循环的运行次数,而不像forEach循环,它不需要任何计数器。当我们使用forEach循环时,我们基本上是说 "对这个集合的每一个元素都这样做",而在循环中,我们明确指出循环将运行的次数。这可能会导致错误,并使代码极难阅读,因为数组的索引是从0开始的。

注意:我们将使用浏览器控制台来演示本篇文章中执行的例子。要打开浏览器的控制台。

  • 在Chrome和其他基于chromium的浏览器中使用F12键。
  • 在Mozilla使用CTRL + SHIFT + K键盘快捷键。
  • 在Safari浏览器中使用Option + ⌘ + C键盘快捷键(如果没有出现开发者菜单,则按⌘ + 打开偏好**,** 并在 高级标签中勾选 "在菜单栏中显示开发菜单")。

JavaScript中forEach循环的语法

array.forEach(function(value, index, arr), thisValue)

用你的数组的实际名称替换数组

参数

  • value:必须的;存储当前元素的值。
  • 索引:可选的; 存储数组中当前元素的索引。
  • arr:可选的;保存包含当前元素的数组对象。
  • thisValue:可选的;这个参数被用作函数的this值。如果没有给出这个参数,undefined 被用作默认的this 值。

undefinedforEach 方法的返回值。

如何在JavaScrip中使用forEach循环

现在我们将使用forEach循环在控制台中输出一个名为numbers 的数组的每个元素,作为一个例子。

var numbers= [1, 2, 3, 4, 5, 6];

numbers.forEach(function (value)

{

console.log(value) ;

})

在上面的例子中,首先,我们声明了一个名为numbers 的数组,并给它分配了六个元素。然后我们使用forEach 循环来循环浏览数组中的每一个项目。然后,我们在forEach循环中声明并定义了一个函数,将循环中当前迭代的元素的值打印到控制台。

我们也可以在循环之外声明和定义这个函数,只需在循环的主体中调用这个函数。

var numbers= [1, 2, 3, 4, 5, 6];

numbers.forEach(pr);

function pr(value)

{

console.log(value);

}

forEach 循环不会对数组中的空元素执行。如果我们像上面提到的那样通过使用 [array.length]属性添加到数组中,并再次运行程序,输出结果将保持不变。

var numbers= [1, 2, 3, 4, 5, 6];

numbers.length = 7;

console.log("The Length of the array is " + numbers.length);

numbers.forEach(pr);

function pr(value)

{

console.log(value);

}

现在我们将尝试对数组中的元素执行不同的操作。首先,让我们试着写一个函数,在控制台上打印出数组中每个元素的平方。

var numbers= [1, 2, 3, 4, 5, 6];

numbers.forEach(pr);

function pr(value)

{

let square = value * value;

console.log(square);

}

现在让我们试着将数组中所有元素的总和输出到控制台。

var numbers= [1, 2, 3, 4, 5, 6];

let sum = 0;

numbers.forEach(pr);

function pr(value)

{

sum = sum + value;

}

console.log(sum);

结论

forEach循环 是一个控制流语句,用于循环处理一个集合中的项目。当我们需要对循环中的每个元素单独执行不同的操作时,它被证明是有用的。

在这篇文章中,我们学习了forEach 循环。我们了解了它是什么以及如何使用它。此外,我们还将它与更常见的for a循环进行了比较。