526互联

typeScript中map和filter的用法

发布时间 2023-12-28 13:58:49作者: 玉米炖排骨

首先，这两个方法map()和filter()都是对调用他们的数组进行遍历。那么在项目中，什么情况下使用map()，又在什么情况下使用filter()呢？
1、map()的使用方法：

arr.map((item,index,array)=>{……})

2、filter()的使用方法：

arr.filter((item,index,array)=>{……})

都是将函数写在方法的括号里，参数也一样，行参的参数说明：

  • item：当前处理的元素

  • index：当前处理元素的索引

  • array：调用map或者filter方法数组本身

下面举一个例子：

let arr=[3,5,17,15,4,14];

let res1=arr.map((item,index,array)=>{
  // return array[index]; //用这种方法也可以获取到当前处理的元素
  return item>5;
});
console.log(res1)//[ false, false, true, true, false, true ]

 

map()方法返回的结果是：[ false, false, true, true, false, true ]

也就是说符合条件或者不符合条件的，都将boolean类型值返回给到新的数组。

let arr=[3,5,17,15,4,14];

let res2=arr.filter((item,index,array)=>{
  return item>5;
});

console.log(res2) //[ 17, 15, 14 ]

filter()方法返回的结果是：[ 17, 15, 14 ]

也就是说符合条件就会把值返回到新的数组中

区别：
可以看到，
map() 的结果只是对当前元素调用函数后，将符合条件boolean类型值返回给到新的数组
filter() 会将结果为true的数组值存到新的数组里面。