快捷導(dǎo)航

在JavaScript中終止forEach循環(huán)的三種方式

更新時(shí)間：2023年11月02日 09:04:12 作者：公號(hào)是前端必修課

如何終止forEach循環(huán)這個(gè)問題估計(jì)會(huì)難倒一部分同學(xué),甚至?xí)腥朔磫?forEach循環(huán)在JavaScript中能終止嗎？本文小編給大家介紹了三種方式可以終止forEach循環(huán),需要的朋友可以參考下

一、序言

這個(gè)問題估計(jì)會(huì)難倒一部分同學(xué)。甚至?xí)腥朔磫枺?code>forEach循環(huán)在JavaScript中能終止嗎？比如，我舉個(gè)例子

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it) => {
  if (it >= 0) {
    console.log(it)
    // 0 1 2 3
    return // or break
  }
})

從這個(gè)例子來看，好像不管是通過return還是break都無法終止forEach循環(huán)。 forEach相當(dāng)于就是函數(shù)的執(zhí)行，比如下面這段代碼，即使func1執(zhí)行了return語句，仍然會(huì)打印出2。

const func1 = () => {
  console.log(1)
  return
}

const func2 = () => {
  func1()
  console.log(2)
}

func2()

二、方法

然而，我能想到三種方式可以終止forEach循環(huán)。

01. 拋出錯(cuò)誤

當(dāng)找到一個(gè)大于等于0的數(shù)字之后，return循環(huán)將終止執(zhí)行，所以控制臺(tái)只會(huì)輸出數(shù)字0，代碼如下：

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

try {
  array.forEach((it) => {
    if (it >= 0) {
      console.log(it) // 輸出：0
      throw Error(`We've found the target element.`)
    }
  })
} catch (err) {
  
}

02. 將數(shù)組長度設(shè)置成0

我們也能通過將數(shù)組長度設(shè)置成0來終止forEach循環(huán)。代碼如下

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it) => {
  if (it >= 0) {
    console.log(it) // 輸出：0
    array.length = 0
  }
})

03. 將數(shù)組元素移除

當(dāng)滿足條件時(shí)，使用splice方法將數(shù)組內(nèi)元素移除，也能終止forEach循環(huán)。代碼如下：

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it, i) => {
  if (it >= 0) {
    console.log(it) // 輸出：0
    array.splice(i + 1, array.length - i)
  }
})

三、建議

建議使用for和some

在日常工作中，一般是不會(huì)出現(xiàn)一種情況是讓你終止forEach循環(huán)的，如果有終止的情況，可以使用for和some方法。

for

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

for (let i = 0, len = array.length; i < len; i++) {
  if (array[ i ] >= 0) {
    console.log(array[ i ])
    break
  }
}

some

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.some((it, i) => {
  if (it >= 0) {
    console.log(it)
    return true
  }
})

到此這篇關(guān)于在JavaScript中終止forEach循環(huán)的三種方式的文章就介紹到這了,更多相關(guān)JavaScript終止forEach循環(huán)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: