数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学如何在 JavaScript 中使用 for...in 语句循环遍历数组？
我们使用 JavaScript 的for...in 语句来循环遍历数组或对象的枚举属性。它是一种 for 循环的变体。与 JavaScript 中的其他循环结构不同，for...in 循环不必关心迭代次数。这是因为迭代大小根据对象的枚举属性或数组中的元素数量而固定。
JavaScript 中的 "for...in" 语句
for...in 循环迭代对象的全部可枚举属性。所有使用简单赋值运算符或默认初始化程序赋值的属性都被视为可枚举属性。
语法
for(var num in numbers){
// statement
}
这创建一个变量num，它迭代数组 numbers 中的所有元素。这个 num 依次获取 numbers 数组中存储的元素的索引。
让我们来看一个 for...in 循环工作的例子。
示例 1
在这里，我们将创建一个字符串数组，然后使用 for...in 循环迭代它。让我们看看相应的代码。
<!DOCTYPE html> <html> <body> <h3> for...in loop in JavaScript</h3> <div id="result"></div> <script> var arr = ["xyz", "abc", "pqr"]; var text = ""; for(var str in arr){ text += arr[str] + ","; } document.getElementById("result").innerHTML = text; </script> </body> </html>
在上面的代码中，str分别取值 0、1 和 2，用于检索数组的元素。
注意，但是索引顺序取决于实现。这意味着不能保证索引按正确的顺序遍历。由于这个原因，不建议将 for...in 循环用于数组。应该使用不同的循环结构，例如传统的 for 循环或 for...of 循环。
虽然 for...in 循环可以使用，但它与对象的配合比与数组更好。这是因为循环变量依次取键值，使对象的迭代非常容易。
语法
for(var num of numbers){
// statement
}
这创建一个变量 num，它迭代数组 numbers 中的所有元素。这个 num 依次获取 numbers 数组中存储的元素的值。
这是一个如何在 JavaScript 中使用 for...of 循环处理对象的示例。
示例 2
在这里，我们将创建一个包含不同数据类型的元素数组。我们将使用 for...of 循环迭代该数组。
<!DOCTYPE html> <html> <body> <h3> for...of loop in JavaScript</h3> <div id="result"></div> <script> var arr = ["Jane Doe", 2 , 59.57]; var text = "The elements of the array are <br><br>"; for(var ele of arr){ text += ele + "<br>"; } document.getElementById("result").innerHTML = text; </script> </body> </html>
在上面的代码中，正如输出中所示，变量ele获取数组中存在的元素的值。
我们还可以使用Array.prototype.forEach()方法遍历数组。forEach() 的参数是一个函数，该函数对数组的所有元素执行。
语法
const arr = ["Jane Doe", 2, 59.57]
arr.forEach(function fun(ele){
// statement
}
注意，“prototype”被替换为数组的名称，在本例中为arr。函数 fun 有一个参数 ele，它依次获取存储在数组 arr 中的元素的值。
这是一个如何在 JavaScript 中使用 forEach() 方法处理数组的示例。
示例 3
在这里，我们将创建一个包含不同数据类型的元素数组。我们将使用 forEach() 方法迭代该数组。
让我们看看相应的代码。
<!DOCTYPE html> <html> <body> <h3> forEach() method in javascript</h3> <div id="result"></div> <script> var arr = ["Jane Doe", 2 , 59.57]; var text = "The elements of the array are <br><br>"; arr.forEach(function fun(ele){ text += ele + "<br>"; }) document.getElementById("result").innerHTML = text; </script> </body> </html>
在上面的代码中，正如输出中所示，变量ele获取数组中存在的元素的值。
结论
for...in、for...of 和 forEach() 结构通过提供传统 for 循环的急需变体，使我们的生活更加轻松。
浏览量 173 次
