详解JS中如何终止foreach循环

 更新时间:2024年01月15日 09:31:35   作者:有蝉  
forEach专门用来循环数组,可以直接取到元素,同时也可以取到index值,终止forEach存在局限性,不能continue跳过或者break终止循环,所以本文给大家详细介绍了在JS中如何终止foreach循环,需要的朋友可以参考下

forEach专门用来循环数组,可以直接取到元素,同时也可以取到index值

存在局限性,不能continue跳过或者break终止循环,没有返回值,不能return

终止foreach循环 :运用抛出异常(try catch)可以终止foreach循环 

for of是ES6新引入的特性。修复了ES5中for in的不足

允许遍历 Arrays(数组)、Strings(字符串)、Maps(映射)、Sets(集合)等可迭代的数据结构

for of 支持return

最下方有个在项目中的实例 

错误用法1:使用break(会报错)

var array = ["第一","第二","第三","第四"];
        
// 直接就报错了
array.forEach(function(item,index){
    if (item == "第三") {
        break;
    }
    alert(item);
});

报错如下 

错误用法2:使用return fasle (只是终止本次循环)

相当于for 循环中的continue

var array = ["第一","第二","第三","第四"];
        
// 会遍历数组所有元素,只是执行跳过"第三",return false下面的代码不再执行而已
array.forEach(function(item,index){
    if (item == "第三") {
        return false;
    }
    console.log(item);// "第一" "第二" "第四"
});
console.log("以下代码")// 以下代码

正确用法:运用抛出异常(try catch)

try {
    var array = ["第一","第二","第三","第四"];
    
    // 执行到第3次,结束循环
    array.forEach(function(item,index){
        if (item == "第三") {
            throw new Error("第三");
        }
        console.log(item);// 第一 第二
    });
} catch(e) {
    if(e.message!="第三") throw e;
};
// 下面的代码不影响继续执行
console.log("下方代码");//下方代码

实例如下

      try {
        this.txt.forEach((item, index) => {
          if (!item.name) {
            throw new Error('单课不能为空!')
          }
          if (!item.val) {
            throw new Error('上课老师不能为空!')
          }
          if (!item.date) {
            throw new Error('上架时间不能为空!')
          }
        })
      } catch (e) {
        this.$message.warning(e.message)
        return
      };

以上就是详解JS中如何终止foreach循环的详细内容,更多关于JS终止foreach循环的资料请关注脚本之家其它相关文章!

相关文章

  • JavaScript实现无阻塞加载的常用方式

    JavaScript实现无阻塞加载的常用方式

    在 JavaScript 中,无阻塞加载(Non-blocking Loading)是优化网页性能的关键技术,通过避免脚本阻塞页面渲染和其他资源的加载,提升用户体验,以下是实现无阻塞加载的常用方法及示例,需要的朋友可以参考下
    2025-03-03
  • 基于JavaScript开发一个有趣的分组抽签小程序

    基于JavaScript开发一个有趣的分组抽签小程序

    在团队合作开发中,经常需要将团队成员分组,来完成各自的任务,而抽签的方式自然是最公平、最简单的方法之一,所以本文就来开发一个有趣的分组抽签小程序吧
    2023-05-05
  • uni-app PC端宽屏适配方案图文详解

    uni-app PC端宽屏适配方案图文详解

    现在uni-app终于官方支持PC宽屏,下面这篇文章主要给大家介绍了关于uni-app PC端宽屏适配方案的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-03-03
  • JavaScript中Object.values()的用法举例

    JavaScript中Object.values()的用法举例

    这篇文章主要给大家介绍了关于JavaScript中Object.values()的用法举例,Object.values()是JavaScript中一个内置的静态函数,用于返回一个对象中所有属性值的数组,需要的朋友可以参考下
    2023-09-09
  • 判断客户端浏览器是否安装了Flash插件的多种方法

    判断客户端浏览器是否安装了Flash插件的多种方法

    各种方法判断客户端浏览器是否安装了Flash插件,对于必须要支持flash才能浏览的页面来说,提前做下说明,用户体验会更好。
    2010-08-08
  • js点击更换背景颜色或图片的实例代码

    js点击更换背景颜色或图片的实例代码

    这篇文章主要介绍了点击更换背景颜色或图片的js代码,需要的朋友可以参考一下
    2013-06-06
  • JavaScript 关键字屏蔽实现函数

    JavaScript 关键字屏蔽实现函数

    JavaScript屏蔽关键字,大概的思路就是去用javascript去替换已有的文本,达到替换的目的
    2009-08-08
  • 莱鸟介绍window.print()方法

    莱鸟介绍window.print()方法

    这篇文章主要介绍了莱鸟介绍window.print()方法的相关资料,需要的朋友可以参考下
    2016-01-01
  • 谈谈JavaScript令人迷惑的==与+

    谈谈JavaScript令人迷惑的==与+

    这篇文章主要介绍了JavaScript中==与+的使用方法,帮助大家更好的理解和学习JavaScript,感兴趣的朋友可以了解下
    2020-08-08
  • 微信小程序实现手机号码验证

    微信小程序实现手机号码验证

    这篇文章主要为大家详细介绍了微信小程序实现手机号码验证,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07

最新评论