在 JavaScript 🤔 中理解forEach

JavaScript 的方法是一种流行的迭代数组工具。它为每个数组元素执行一次提供的函数。但是，与传统的 or 循环不同，它被设计为为执行每个元素的函数，而没有内置机制来过早停止或中断循环。forEachforwhileforEach

const fruits = \["apple", "banana", "cherry"\];  
fruits.forEach(function(fruit) {  
  console.log(fruit);  
});

此代码将输出：

apple
banana
cherry

限制 🚫forEach

1. break在forEach

的一个关键限制是无法使用传统的控制语句（如 或）停止或中断循环。如果尝试在 中使用 ，则会遇到语法错误，因为在回调函数中不适用。forEachbreakreturnbreakforEachbreak

试图打破forEach

通常，当满足特定条件时，语句用于过早退出循环。break

const numbers = [1, 2, 3, 4, 5];  
numbers.forEach(number => {  
  if (number > 3) {  
    break; // Syntax Error: Illegal break statement  
  }  
  console.log(number);  
});

当您尝试在循环中使用时，JavaScript 会抛出语法错误。这是因为它被设计为在传统循环（如 、 、）中使用，并且在 的回调函数中无法识别。breakforEachbreakforwhiledo...whileforEach

2. 在returnforEach

在其他循环或函数中，语句退出循环或函数，如果指定了值，则返回一个值。return

在 的上下文中，不会跳出循环。相反，它只是退出回调函数的当前迭代，然后移动到数组中的下一个元素。forEachreturn

尝试返回forEach

const numbers = [1, 2, 3, 4, 5];  
numbers.forEach(number => {  
  if (number === 3) {  
    return; // Exits only the current iteration  
  }  
  console.log(number);  
});

输出

1
2
4
5

在此示例中，跳过 的打印，但循环继续处理其余元素。return3

使用异常🆕中断循环forEach

虽然不建议经常使用，但从技术上讲，可以通过抛出异常来停止循环。这种方法虽然是非正统的，并且由于其对代码可读性和错误处理的影响而通常不建议这样做，但可以有效地停止循环。forEach

const numbers = [1, 2, 3, 4, 5];  
try {  
  numbers.forEach(number => {  
    if (number > 3) {  
      throw new Error('Loop stopped');  
    }  
    console.log(number);  
  });  
} catch (e) {  
  console.log('Loop was stopped due to an exception.');  
}  

Output: 1, 2, 3, Loop was stopped due to an exception.

在此示例中，当满足条件时，将引发异常，从而过早退出循环。但是，正确处理此类异常以避免意外的副作用非常重要。forEach

Breaking Loops 💡 的替代方案forEach

使用循环for...of

ES6 （ECMAScript 2015） 中引入的循环提供了一种现代、干净且可读的方式来迭代可迭代对象，如数组、字符串、映射、集合等。与 和 相比，它的主要优势在于它与 和 等控制语句兼容，在环路控制方面提供了更大的灵活性。for...offorEachbreakcontinue

优点：for...of

• 灵活性：允许使用 、 和 语句。breakcontinuereturn
• 可读性：提供清晰简洁的语法，使代码更易于阅读和理解。
• 多功能性：能够迭代各种可迭代对象，而不仅仅是数组。

实际例子for...of

考虑以下场景，我们需要处理数组的元素，直到满足特定条件：

const numbers = [1, 2, 3, 4, 5];  
  
for (const number of numbers) {  
  if (number > 3) {  
    break; // Successfully breaks the loop  
  }  
  console.log(number);  
}

输出：

1
2
3

在此示例中，循环遍历数组中的每个元素。一旦遇到大于 的数字，它就会利用该语句退出循环。使用 时无法实现此级别的控制。numbers3breakforEach

其他方法

• Array.prototype.some()：此方法可用于通过返回 来模拟断开循环。true
• Array.prototype.every()：此方法在返回值时停止迭代。false

结论 🎓

虽然 JavaScript 中的方法提供了一种简单的数组迭代方法，但它缺乏中断或停止中循环的灵活性。了解此限制对开发人员至关重要。幸运的是，像循环这样的替代方法，以及像 和 这样的方法，为更复杂的方案提供了必要的控制。掌握这些概念不仅可以提高您的 JavaScript 技能，还可以让您为具有挑战性的面试问题和实际编程任务做好准备。forEachfor...ofsome()every()