foreach 跳出循环

前端这点事 2020年01月02日 13:34 2030 0

今天写代码时候，用到了一个foreach循环，我想做的是当里面某一个值等于指定的值的时候，我希望停止foreach并且返回这个值。

我开始用的如下代码：

<script>
     var arr = [1,2,3,4,5];
     arr.forEach(item => {
         if (item === 2){
             return false
         }
       alert(item)
     })
</script>

可以看到，唯独没有弹出2这个选项，但是其他的都一一弹出来了，这个与我们想要的完全不符，因为我希望的是当item === 2 的时候，可以停止foreach的循环。

百度一下，发现有三种处理方式，下面一一介绍下：

第一种：

实用try...catch方式，代码如下：

Markup

<script>
    var arr = [1,2,3,4,5];
    try {
        arr.forEach(item => {
            if (item === 2){
                throw new Error("ending foreach");
            }
            alert(item)
        })
    } catch (e){
        console.log('catch error')
    }
</script>

但是个人觉得这种方式不够优雅~~

第二种方式：

Markup

<script>
    var arr = [1,2,3,4,5];
    arr.every(item => {
        if (item === 2){
            return false
        } else {
            alert(item)
            return true
        }
        
    })
</script>

这种方式巧妙的运用了，数组的every，如果数组中有任何一个不满足条件的值，就会return false，导致代码跳出~~

第三种方式：

<script>
var arr = [1,2,3,4,5];
arr.some(item => {
    if (item === 2){
        return true
    }
    alert(item)
})
</script>

这种和every类似，只要有一个满足就会return true，也会跳出代码，两种方式都可使用。

标签： foreach

本文地址： https://www.ltonus.com/JavaScript/foreach-stop.html

文章来源：前端这点事