《三分钟阅读》你不知道的forEach的一些小细节

三分钟阅读：给自己3分钟的时间，拾起自己遗漏的知识点，这是第一期

前言

从今天开始，我准备写个《三分钟阅读》系列，三分钟时间不长，无法系统的介绍一个知识点，但能够描述清楚一个知识点的一部分。我的初衷是三分钟能够给你的知识网络添块砖，帮你拾起一些自己平常容易忽略的知识点，每天进步一点点。

主题

今天的主题准备讲讲forEach，forEach一般用来遍历数组，有时候为了提高性能，在处理完数据之后，我们会提前跳出循环，通过break、return、continue，然而，在forEach中是有点问题的。

return不能跳出循环

我们看下面这个例子，我们想在遍历到第二个位置的时候，跳出循环。

const array = [1,2,3];
array.forEach((item,index)=>{
  if(index === 1){
    return
  }
  console.log(item);
})

输出结果是啥呢？咋一看，你可能会说是 1，但实际运行我们会发现结果是1 3，因为forEach里面，使用return并不会终止循环，会继续遍历。

break不能中止循环

把之前例子修改一下，同样，我们想遍历到第二个位置的时候，中止循环，期望输出结果是1

const array = [1,2,3];
array.forEach((item,index)=>{
  if(index === 1){
    break
  }
  console.log(item);
})

运行一下，你会发现直接报错，提示Unsyntactic break。

continue不能跳出循环

再修改一下，我们希望跳过2，直接输出1 3

const array = [1,2,3];
array.forEach((item,index)=>{
  if(index === 1){
   continue
  }
  console.log(item);
})

同样，类似于break，报错，提示Unsyntactic continue

启示

视情况跳出中止循环在我们业务开发中是很常见，因为能够减少无谓的遍历，从而降低代码运行时间，提高性能，所以替代方式都有哪些呢？

1. 通过简单的for循环或者for...of循环，return、break、continue都能够正常运行
2. 通过es6提供的一些新api，比如完成某个条件就跳出遍历，我们可以使用every()或者some()方法

最后，在遍历数组的时候多想想什么样的方法比较适合，不要一碰到遍历，就使用forEach map，如果可以提前中止循环，就要学会提前中止，减少代码执行时间。