js中Array.forEach跳出循环的方法实例

 更新时间:2021年09月01日 10:02:07   作者:陌生的L君  
相信大家都知道forEach适用于只是进行集合或数组遍历,for则在较复杂的循环中效率更高,下面这篇文章主要给大家介绍了关于js中Array.forEach跳出循环的相关资料,需要的朋友可以参考下

forEach()方法

语法:array.forEach(callback(currentvalue,index,arr) ,thisValue)

其中

callback为数组中每个元素执行的函数,该函数可接受1-3个参数:

  • currentvalue参数表示数组的当前元素项,必须的参数
  • index参数表示的当前元素下标,可选参数
  • arr参数表示当前元素所属的数组,可选参数

thisValue表示执行回调函数callback()时的this指向。可选参数。当不写时,则默认是指向window全局

示例

    var arr = [1, 3, 5, 13, 2];
    var res = arr.forEach(function(item,index) {
        console.log(`数组第${index+1}个元素是${item}`);
    })
    console.log(res);//forEach的返回值为undefined,

运行结果:

js中 Array.forEach如何跳出循环

forEach是不能通过break或者return跳出循环的,一般跳出循环的方式为抛出异常:

 try {
   let array = [1, 2, 3, 4]
   array.forEach((item, index) => {
     if (item === 3) {
       throw new Error('end')//报错,就跳出循环
     } else {
       console.log(item)
     }
   })
 } catch (e) {
 }

这种写法反而很麻烦。

解决方式:

1.使用every替代:

let array = [1, 2, 3, 4]
array.every((item, index) => {
  if (item === 3) {
    return true
  } else {
    console.log(item)
  }
})

2.自己写一个😁

//可跳出循环的数组遍历
Array.prototype.loop = function(cbk) {
  //判断当前数组是否为空
  if (this?.length) {
    for (let i = 0; i < this.length; i++) {
      let stop = cbk(this[i], i, this)
      //判断是否停止循环
      if (stop) {
        break
      }
    }
  }
}


let array = [1, 2, 3, 4]
array.loop ((item, index) => {
  if (item === 3) {
    return true
  } else {
    console.log(item)
  }
})

总结

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

相关文章

  • Ionic如何实现下拉刷新与上拉加载功能

    Ionic如何实现下拉刷新与上拉加载功能

    在日常项目开发中我们经常见到下拉刷新上拉加载的功能,接下来通过本文给大家介绍ionic如何实现下拉刷新与上拉加载的相关资料,需要的朋友可以参考下
    2016-06-06
  • js实现StringBuffer的简单实例

    js实现StringBuffer的简单实例

    下面小编就为大家带来一篇js实现StringBuffer的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • js实现弹框效果

    js实现弹框效果

    这篇文章主要为大家详细介绍了js实现弹框效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-03-03
  • javascript初学者常用技巧

    javascript初学者常用技巧

    这篇文章主要介绍了javascript初学者常用技巧,包括javascript的存放位置、格式及焦点事件等,需要的朋友可以参考下
    2014-09-09
  • JavaScript具有类似Lambda表达式编程能力的代码(改进版)

    JavaScript具有类似Lambda表达式编程能力的代码(改进版)

    在之前的一篇博文中我介绍了一种方法可以让JavaScript具有一种近似于Lambda表达式的编程能力——但是它有一些缺点,其中妨碍它的使用的最主要的一条就是多了一层括号,让代码变得难以阅读。
    2010-09-09
  • javascript+iframe 实现无刷新载入整页的代码

    javascript+iframe 实现无刷新载入整页的代码

    用iframe也可以实现,但没有上述做法完美,参见discuz那些网站,如登陆弹出一个层,也是载入的一个页面,但我发现状态栏左边出现的是 正在打开about:blank
    2010-03-03
  • 如何基于viewport vm适配移动端页面

    如何基于viewport vm适配移动端页面

    这篇文章主要介绍了如何基于viewport vm适配移动端页面,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-11-11
  • JavaScript canvas实现动态点线效果

    JavaScript canvas实现动态点线效果

    这篇文章主要为大家详细介绍了JavaScript canvas实现动态点线效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-08-08
  • Ant Design Blazor 组件库的路由复用多标签页功能

    Ant Design Blazor 组件库的路由复用多标签页功能

    在 Ant Design Blazor 组件库中实现多标签页组件的呼声日益高涨。于是,我利用周末时间,结合 Blazor 内置路由组件实现了基于 Tabs 组件的 ReuseTabs 组件,需要的朋友跟随小编一起看看吧
    2021-07-07
  • javascript最基本的函数汇总

    javascript最基本的函数汇总

    这篇文章主要给大家汇总介绍了javascript最基本的7个函数,十分的实用,有需要的小伙伴可以参考下。
    2015-06-06

最新评论