使用for 循环在 JavaScript 中迭代数组
JavaScript 中的for 循环是一种常见的循环结构，用于遍历集合或执行重复任务，本文将详细介绍如何使用for 循环来迭代数组，并提供相关示例和问题解答。
基本语法
for 循环的基本语法如下：
for (初始化; 条件; 更新) {
// 循环体
}
初始化: 通常用于声明和初始化循环变量。
条件: 每次迭代前都会检查这个条件，如果为true，则继续执行循环体；如果为false，则退出循环。
更新: 每次循环结束后执行的代码，通常用于更新循环变量。
示例：迭代数组
假设我们有一个包含数字的数组，我们希望打印每个元素。
let numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
在这个例子中：
i 是循环变量，从0 开始。
i < numbers.length 是循环条件，确保i 不会超出数组的范围。
i++ 是更新部分，每次循环后递增i。
使用for...of 循环迭代数组
除了传统的for 循环外，ES6 还引入了for...of 循环，专门用于迭代可迭代对象（如数组、字符串等）。
let fruits = ["apple", "banana", "cherry"];
for (let fruit of fruits) {
console.log(fruit);
}
在这个例子中，fruit 依次取数组中的每个元素，直到遍历完所有元素。
表格示例：传统for 循环与for...of 循环对比
| 特性 | 传统for 循环 |
for...of 循环 |
| 语法 | for (let i = 0; i< array.length; i++) |
for (let item of array) |
| 适用场景 | 需要索引时 | 不需要索引时 |
| 简洁性 | 较低 | 较高 |
| 可读性 | 一般 | 较好 |
| ES6+ 支持 | 支持 | 专为 ES6+ 设计 |
相关问题与解答
问题 1：如何在for 循环中使用break 和continue？
解答：
break: 立即退出整个循环，不再执行循环体中的剩余语句，也不再进行后续的迭代。
continue: 跳过当前迭代的剩余语句，并开始下一次迭代。
示例代码：
let numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
if (numbers[i] === 3) {
continue; // 跳过本次迭代，不打印 3
}
if (numbers[i] > 3) {
break; // 退出循环，不打印 4 和 5
}
console.log(numbers[i]);
}
问题 2：如何在for...of 循环中获取元素的索引？
解答：
虽然for...of 循环本身不提供索引，但可以通过其他方式获取索引，例如使用entries() 方法。
示例代码：
let fruits = ["apple", "banana", "cherry"];
for (let [index, fruit] of fruits.entries()) {
console.log(Index: ${index}, Fruit: ${fruit});
}
在这个例子中，entries() 方法返回一个数组迭代器对象，该对象包含数组中每个索引和值对。
小伙伴们，上文介绍了“for函数js”的内容，你了解清楚吗？希望对你有所帮助，任何问题可以给我留言，让我们下期再见吧。
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/733496.html
微信扫一扫 