JavaScript如何退出循环

214 阅读2分钟

1、forEach 退出循环

forEach 方法是 JavaScript 数组对象内置的一个迭代器,它遍历数组中的每一个元素并执行一定的函数操作。由于 forEach 方法是自动遍历整个数组,因此无法通过 break 或 return 语句退出循环。也就是说forEach() 方法是用于遍历数组的,而不是用来执行循环的,所以它没有办法让你像普通的循环一样控制流程。

以下是四种跳出 forEach 循环的方法及示例:

(1) throw new Error()

通过抛出异常的方式,强制退出整个 forEach 循环。

try {
  [1, 2, 3, 4, 5].forEach(function(item) {
    if (item === 3) {
      throw new Error('exit')
    }
    console.log(item)
  })
} catch (e) {
  if (e.message !== 'exit') {
    throw e  
  }
}

// 输出
1
2
e:\Users\Allen's hp\Desktop\tempCodeRunnerFile.js:3
      throw new Error('exit')

(2)return + 变量

return 语句只能跳出本次迭代,无法完全退出循环,数组会继续迭代直到结束,因此无法完全退出循环。

[1, 2, 3, 4, 5].forEach(function(item) {
  if (item === 3) {
    return
  }
  console.log(item)
})

// 输出
1
2
4
5

但是可以通过一个变量来保证满足条件时不再继续往下走

let isBreak = false;
[1, 2, 3, 4, 5].forEach((item) => {  
    if (isBreak || item === 3) {    
        isBreak = true;    
        return;  
    }  
    console.log(item);
});

// 输出
1
2

(3)some

some 方法是 ECMAScript 5 新增的数组方法,它可以在遍历数组时返回 true 或 false,来控制是否继续遍历。如果 some 方法的回调函数返回 true,就会停止遍历。

[1, 2, 3, 4, 5].some(function(item) {
  if (item === 3) {
    return true
  }
  console.log(item)
  return false
})

// 输出
1
2

请注意,虽然有以上退出 forEach 循环的方法,但是并不建议在 forEach 循环中使用它们,因为这种做法可能会导致代码出现异常,或者增加代码的复杂度,不够简洁。如果需要遍历数组并在一定条件下停止遍历,建议使用其他的循环语句,如 for、for of 或 while 循环。

2、continue、break、return区别

(1) continue: 跳出本地循环,进入下一次循环

for(let i = 0; i < 5; i++) {
    if(i == 3) {
        continue;
    }
    console.log(i); // 0,1,2,4
}

(2) break:跳出当前循环(如为多层循环,不影响外层循环)

for(let i = 0; i < 5; i++) {
    if(i == 3) {
        break;
    }
    console.log(i);  // 0,1,2
}

(3) return:结束当前函数调用

所以不能在for循环中使用

3、总结

(1)forEach是一个迭代器,所以无法使用break或continue等来控制循环流程的操作来终止循环。可以通过every或some这类来实现满足条件后终止循环。

(2)continue为跳过本次循环,进入下一次循环。break为跳出当前循环,如果有多层循环,不影响外层循环。return为结束当前函数调用,所以for循环中不能使用return。