JS数组的迭代方法

数组的五个迭代方法如下:

①every():对数组每一项都运行传入的函数,如果对每一项函数都返回ture,则这个方法返回true。

②filter():对数组每一项都运行传入的函数,函数返回true的项会组成数组之后返回。

③forEach():对数组每一项都运行传入的函数,没有返回值。   注意:不支持break和continue(但可以用return代替或者try__catch),不能对循环对象中的内容实现增删改,对空数组不会执行回调函数。如果面试问非要用forEach跳出的话用抛出异常的方式解决。

④map():对数组每一项都运行传入的函数,返回由每次函数调用的结果构成的数组。

⑤some():对数组每一项都运行传入的函数,如果有一项函数返回true,则这个方法返回true

这些方法都不改变调用它们的数组。

在这些方法中,evert()和some()最相似的,都是从数组中搜索符合某个条件的元素。对every()来说,传入的函数必须对某一项都返回true,它才会返回true;否则,他就返回false。而对some()来说,只要有一项让传入的函数返回true,他就会返回true。下面是一个例子:

let numbers=[1,2,3,4,5,4,3,2,1];

let everyResult=numbers.every((item,index,array)=>item>2);
alert(everyResult);     //false

let someResult=numbers.some((item,index,array)=>item>2);
alert(someResult);     //true

以上代码调用了every()和some(),传入的函数都是在给定项大于2时返回true。every()返回false是因为并不是每一项都能达到要求。而some()返回true是因为至少有一项满足条件。

  下面再看一看filter()方法。这个方法基于给定的函数来决定某一项是否应该包含在它返回的数组中。比如,要返回一个所有数值都大于2的数组,可以使用如下代码:

let numbers=[1,2,3,4,5,4,3,2,1];

let filterResult=numbers.filter(item,index,array)=>item>2);
alert(filterResult);        // 3,4,5,4,3

  这里,调用filter()返回的数组包含3,4,5,4,3,因为只有对这些项传入的函数才返回true,这个方法非常适合从数组中筛选满足给定条件的元素。

  接下来map()方法也会返回一个数组。这个数组的每一项都是对原始数组中同样位置的元素运行传入函数而返回的结果。例如,可以将一个数组中的每一项都乘以2,并返回包含所有结果的数组,如下所示:

let numbers=[1,2,3,4,5,4,3,2,1];
let mapResult=numbers.map((item,index,array)=>item*2);
alert(mapResult);           //2,4,6,8,10,8,6,4,2

  以上代码返回了一个数组,包含原始数组每个值乘以2的结果。这个方法非常适合创建一个与原始数组元素一一对应的新数组。

  最后,再来看一看forEach()方法。这个方法只会对每一项运行传入的函数,没有返回值。本质上,forEach()方法相当于使用for遍历循环遍历数组。比如

let numbers=[1,2,3,4,5,4,3,2,1];
numbers.forEach((item,index,array)=>{
   //执行某些操作 
});

数组的这些迭代方法通过执行不同操作方便了对数组的处理

注意:以下是用forEach跳出循环的方式

复制代码
// 使⽤forEach跳出整个循环,使⽤rty-catch
function useForeach(Arr) {
  let obj = {}
  try {
    Arr.forEach(function(item) {
      if (item.id == '002') {
        // 找到⽬标项,赋值。然后抛出异常
        obj = item
        throw new Error('return false')
      }
    });
  } catch (e) {
    // 返回id===002的这⼀项的数据
    return obj
  }
}
console.log(useForeach(arr))
复制代码

或者

//内容为3,不遍历该项
var arr = [1, 2, 3];
arr.forEach(function(item) {
    if (item === 3) {
        return;
    }
    console.log(item);
});

 

posted @   Jaetyn  阅读(1108)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示