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

目录
  • forEach()方法
  • 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跳出循环内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • JS forEach跳出循环2种实现方法

    假设当我们只需知道某个数组有没有某个属性,如果找到了直接跳出循环,省略掉剩下的循环步骤是较优化的操作,但是for中是可以利用break跳出循环,但break在forEach中无效,那么forEach能不能跳出循环呢?当然是可以. 1.正常for循环break跳出循环 let strArr = ['a', 'b', 'c', 'd'], i = 0, length = strArr.length; for (; i < length; i++) { console.log(strArr[i]);/

  • JS面试题之forEach能否跳出循环详解

    当年懵懂无知的我被问到这个问题时,脑袋一片空白,当然也没答对,一直以来我对forEach都有一种错误的理解,由于它比原始的for循环简洁许多,导致我一度认为那是为了方便书写所创造出来的语法糖,在业务中也经常使用,但从没考虑过这种方式存在的问题. forEach使用说明 参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach?v=example arr.for

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

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

    目录 forEach()方法 js中 Array.forEach如何跳出循环 解决方式: 总结 forEach()方法 语法:array.forEach(callback(currentvalue,index,arr) ,thisValue) 其中 callback为数组中每个元素执行的函数,该函数可接受1-3个参数: currentvalue参数表示数组的当前元素项,必须的参数 index参数表示的当前元素下标,可选参数 arr参数表示当前元素所属的数组,可选参数 thisValue表示执行回

  • JS中数据类型的正确判断方法实例

    目录 前言 typeof是否能正确判断类型? instanceof是否能正确判断类型? Object.prototype.toString.call() constructor Array.isArray() 正则判断 总结 前言 Javascript是一门动态类型的语言,一个变量从声明到最后使用,可能经过了很多个函数,而数据类型也会发生改变,那么,对一个变量的数据类型判断就显得尤为重要. typeof是否能正确判断类型? typeof 是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的数

  • javascript中Array数组的迭代方法实例分析

    本文实例讲述了javascript迭代的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: //filter() 利用指定的函数确定是否返回数组中包涵的某一项 var num = [1,2,3,4,5,6,12]; num.filter(function(item, index, array){ return (item > 2); //[3, 4, 5, 6, 12] }); //map() 返回一个数组,数组中每一项都是在原始数组中的对应项上运行传入参数的结果 var nu

  • JS中的forEach、$.each、map方法推荐

    forEach是ECMA5中Array新方法中最基本的一个,就是遍历,循环.例如下面这个例子: [1, 2 ,3, 4].forEach(alert); 等同于下面这个for循环 var array = [1, 2, 3, 4]; for (var k = 0, length = array.length; k < length; k++) { alert(array[k]); } Array在ES5新增的方法中,参数都是function类型,默认有传参,forEach方法中的function回

  • JS中改变this指向的方法(call和apply、bind)

    this是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化.但是总有一个原则,那就是this指的是调用函数的那个对象. this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍三种方式: 1.call用作继承时: function Parent(age){ this.name=['mike','jack','smith']; this.age=age; } function Child(age){ Parent.call(this,age);

  • 判断js中各种数据的类型方法之typeof与0bject.prototype.toString讲解

    1.typeof(param) 返回param的类型(string) 这种方法是JS中的定义的全局方法,也是编译者们最常用的方法,优点就是使用简单.好记,缺点是不能很好的判断object.null.array.regexp和自定义对象. 示例代码: 复制代码 代码如下: var str='str';var arr=['1','2'];var num=1;var bool=true;var obj={name:'test'};var nullObj=null;var undefinedObj=un

  • PHP实现JS中escape与unescape的方法

    本文实例讲述了PHP实现JS中escape与unescape的方法.分享给大家供大家参考,具体如下: JavaScript中的escape和unescape是吧字符串转换为unicode十六进制编码,跟JSON的编码格式是一样的,所以可以通过PHP中的json_encode和json_decode实现PHP版本的escape和unescape. 代码如下: <?php function escape($str) { return str_replace('\\', '%', substr(jso

  • js中scrollTop()方法和scroll()方法用法示例

    本文实例讲述了js中scrollTop()方法和scroll()方法用法.分享给大家供大家参考,具体如下: 设置滚动条据顶部的高度: $("div").scrollTop(100); //把 scroll top offset 设置为 100px 获得滚动条的高度: $("div").scrollTop()://获得 scroll top offset 触发滚动事件 $(selector).scroll() 将函数绑定到滚动事件中: $(selector).scro

  • JS创建事件的三种方法(实例代码)

    1.普通的定义方式 <input type="button" name="Button" value="确定" onclick="Sfont=prompt('请在文本框中输入红色','红色',' 提示框 '); if(Sfont=='红色'){ form1.style.fontFamily='黑体'; form1.style.color='red'; }" /> 这是最常见的一种定义方式,直接将JS事件定义在需要的

  • JS中的hasOwnProperty()和isPrototypeOf()属性实例详解

    这两个属性都是Object.prototype所提供:Object.prototype.hasOwnProperty()和Object.prototype.isPropertyOf() 先讲解hasOwnProperty()方法和使用.在讲解isPropertyOf()方法和使用 看懂这些至少要懂原型链 一.Object.prototype.hasOwnProperty() 概述 hasOwnProperty()方法用来判断某个对象是否含有指定的自身属性 语法 obj.hasOwnPropert

随机推荐