foreach 跳出循环

前端这点事 1378 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

上一篇当前文章已是最后一篇了

下一篇前端包管理工具详解

发表评论 (已有0条评论)

还木有评论哦,快来抢沙发吧~