JavaScript中for与forEach分别如何跳出循环

 更新时间:2024年01月08日 10:45:45   作者:swimxu  
forEach的优势一个是它的回调函数形成了一个作用域,它的curItem和i不会像for循环一样污染全局变量,这篇文章主要给大家介绍了关于JavaScript中for与forEach分别如何跳出循环的相关资料,需要的朋友可以参考下

脚本之家 / 编程助手:解决程序员“几乎”所有问题!
脚本之家官方知识库 → 点击立即使用

for 循环

在 for 循环中,退出循环的两种方式:

  • break; 退出整个循环
  • continue; 退出当次循环
1
2
3
4
5
6
7
8
9
10
11
12
let array = [1, 2, 3, 4, 5, 6, 7, 8, 9];
for (let i = 0; i < array.length; i++) {
 if (array[i] === 6) {
   // break; // 退出整改循环,
   continue; // 退出当次循环
 }
 
 // 其他操作...
 console.log('Loop:', array[i]);
}
 
// 某种情况下,也可以使用 return 完成终止循环

break 退出整个循环

continue 退出当次循环

forEach

在JavaScript中,forEach方法是用于遍历数组的方法,它会对数组中的每个元素执行指定的操作。

forEach方法本身并不提供直接的方式来跳出循环,但你可以使用一些技巧来跳出循环模拟跳出循环的效果

方法一:try{}catch(){} 结合 throw 抛错的方式退出循环

1
2
3
4
5
6
7
8
9
10
let array = [1, 2, 3, 4, 5, 6, 7, 8, 9];
try {
  array.forEach((element) => {
    if (element === 6) throw new Error('End Loop!')
    // 其他操作
    console.log('Loop:', element)
  })
} catch (e) {
  console.log(e)
}

方法二:是使用一个标志变量,通过控制该变量的值来跳出循环

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
let array = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 定义一个变量
let isBreak = false;
array.forEach((item) => {
  console.log("其实每次都会循环:", item);
 
  // 某个条件满足时设置 isBreak 为 true,方便跳出循环
  if (item > 4) {
    isBreak = true;
  }
 
  // 检查是否需要跳出循环
  if (isBreak) {
    return; // 终止当次循环,但会继续执行下一次循环,下一次循环会继续判断
  }
 
  // 其他操作...
  console.log('其他操作:', item);
});

在上述示例中,通过设置 isBreak 变量为 true,在下一次迭代开始之前使用 return 中断了当前的迭代,从而模拟了跳出循环的效果。

需要注意的是,这种方法只能跳出当前的迭代,而不能直接跳出整个 forEach 循环。如果你需要完全跳出 forEach 循环,可以考虑使用其他循环结构,如 for 循环或 while 循环,以便更好地控制循环的流程。

提到在一段程序中如果碰到需要终止,结束一个循环,函数或者一段代码,一般会想到以下这几个关键字returncontinuebreak

简述一下三者的区别:

  • break: 终止整个循环(有内层循环时终止的是内层循环),退出switch语句;只能用于循环或者switch语句中,其他地方使用会报错
  • continue:与break相似,不同之处在于结束的是本次循环,相当于跳过本次循环执行下一次循环;只能用于while,do/while,for,for/in循环中,其他地方使用会报错
  • return: return false截断语句之后的代码执行,如果用于函数中,可以返回一个特点的值,做完函数的返回值;不能用在循环中

总结

到此这篇关于JavaScript中for与forEach分别如何跳出循环的文章就介绍到这了,更多相关JS for与forEach跳出循环内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

蓄力AI

微信公众号搜索 “ 脚本之家 ” ,选择关注

程序猿的那些事、送书等活动等着你

原文链接:https://blog.csdn.net/qq_53931766/article/details/132364071

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 reterry123@163.com 进行投诉反馈,一经查实,立即处理!

相关文章

  • 如何利用JavaScript实现排序算法浅析

    如何利用JavaScript实现排序算法浅析

    排序算法是笔试中经常出现的,提起排序算法就一定要提下算法复杂度和大O表示法,算法复杂度是指算法在编写成可执行程序后,运行时所需要的资源,资源包括时间资源和内存资源,这篇文章主要给大家介绍了关于如何利用JavaScript实现排序算法的相关资料,需要的朋友可以参考下
    2021-11-11
  • javascript中直接引用Microsoft的COM生成Word

    javascript中直接引用Microsoft的COM生成Word

    直接引用Microsoft的COM是可以生成Word的,下面为大家介绍下实现的javascript代码
    2014-01-01
  • js实现同一页面可多次调用的图片幻灯切换效果

    js实现同一页面可多次调用的图片幻灯切换效果

    这篇文章主要介绍了js实现同一页面可多次调用的图片幻灯切换效果,可实现在同一页面中多次调用幻灯切换效果,非常具有实用价值,需要的朋友可以参考下
    2015-02-02
  • JavaScript判断页面加载完之后再执行预定函数的技巧

    JavaScript判断页面加载完之后再执行预定函数的技巧

    这篇文章主要介绍了JavaScript判断页面加载完之后再执行预定函数的技巧,原理还是利用监听器监听元素事件、被触发则执行函数,需要的朋友可以参考下
    2016-05-05
  • JavaScript闭包相关知识解析

    JavaScript闭包相关知识解析

    这篇文章主要介绍了JavaScript闭包相关知识解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-10-10
  • JavaScript中的无阻塞加载性能优化方案

    JavaScript中的无阻塞加载性能优化方案

    这篇文章主要介绍了JavaScript中的无阻塞加载性能优化方案,本文讲解了Deferred Scripts 延期脚本、Dynamic Script Elements 动态脚本元素、XMLHttpRequest Script Injection XHR脚本注入等内容,需要的朋友可以参考下
    2014-10-10
  • js document.write()使用介绍

    js document.write()使用介绍

    一个最基本的JavaScript命令是document.write。这个命令简单地打印指定的文本内容到页面上。为了逐字打印文本,在打印的文本字符串加上单引号
    2014-02-02
  • 菜单制作学习一个小东西

    菜单制作学习一个小东西

    菜单制作学习一个小东西...
    2006-09-09
  • 基于JS实现移动端左滑删除功能

    基于JS实现移动端左滑删除功能

    最近做个项目,需要实现移动端左滑删除功能,当时js代码将网上找的进行删减优化,下面通过本文给大家分享基于JS实现移动端左滑删除功能,感兴趣的朋友一起看看
    2017-07-07
  • 查找JS对象中是否包含某个变量的6种方法总结

    查找JS对象中是否包含某个变量的6种方法总结

    在JavaScript中,我们可以通过多种方法来判断一个数组中是否包含某个特定的值,这篇文章主要给大家介绍了关于如何查找JS对象中是否包含某个变量的6种方法,需要的朋友可以参考下
    2024-08-08

最新评论