js中数组常用方法(map,filter,forEach,reduce)

本文深入探讨了JavaScript中的四个重要数组方法:map用于映射数组元素并返回新数组,filter用于筛选满足条件的元素,forEach遍历数组但不返回结果,reduce则用于对数组元素进行聚合操作。通过实例代码展示了如何使用这些方法来操作对象数组,如增加年龄、过滤年龄大于18的元素以及合并数组元素的属性。
摘要由CSDN通过智能技术生成
  1. map方法:
    对数组中的每一项,返回每次函数调用的结果组成的数组。
    注意:
    1.map方法不会改变原数组;
    2.一定要自己手动返回。
// 例:将数组中每一项的age加1
let arr=[{name:'冬雨',age:18},{name:'冬梅',age:19}]
arr =arr.map(item=>{
   item.age = item.age+1;
   return item;
})
console.log(arr)
//=> [ { name: '冬雨', age: 19 }, { name: '冬梅', age: 20 } ]

2.filter
对数组中的每一项运行函数,返回该函数会返回true的项组成的数组。

//返回数元素中age大于18的元素组成的数组。
let arr=[{name:'冬雨',age:18},{name:'冬梅',age:19}]
arr =arr.filter(item=>{
   return item.age>18;
   
})
console.log(arr)
//=>[ { name: '冬梅', age: 19 } ]

  1. forEach
    对数组中的每一项云顶给定的函数,该函数无返回值。
let arr=[{name:'冬雨',age:18},{name:'冬梅',age:19}]
arr.forEach(item=>{
  console.log(item);
})
// =>{ name: '冬雨', age: 18 }
//   { name: '冬梅', age: 19 }

4.reduce
reduce可接受四个参数,常见的是接受两个参数的;即:前一个值,当前值,求和的例子大家都知道呢,我们来看另一个。
这里的需求就是将所有的年龄合在一个字符串中,将姓名和在一个字符串中,当前通过转换还可以转换数组形式。

let arr=[{name:'冬雨',age:18},{name:'冬梅',age:19}]
let  arr2= arr.reduce((prev,cur)=>{
let obj={age:[],name:[]}
  obj.age =  prev.age+','+cur.age;
  obj.name =  prev.name+','+cur.name;
 return obj;
})
console.log(arr2);
//=>{ age: '18,19', name: '冬雨,冬梅' }
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript数组有许多常用方法可以帮助我们处理和操作数组。以下是一些常见的JavaScript数组方法: 1. Array.concat(arr1, arr2...):将两个或多个数组合并成一个新数组。原数组不会被改变。 2. Array.splice(index, howmany, arr1, arr2...):用于添加或删除数组的元素。从指定的index位置开始删除howmany个元素,并将arr1、arr2...依次插入到数组。如果howmany为0,则不会删除任何元素。原数组会被改变。 3. Array.map(function):对数组的每个元素执行指定的函数,并将函数的返回值组成一个新的数组。原数组不会被改变。 4. Array.filter(function):根据指定函数的条件,筛选出满足条件的元素,返回一个新的数组。原数组不会被改变。 5. Array.forEach(function):对数组的每个元素执行指定的函数,没有返回值。原数组不会被改变。 6. Array.find(function):返回数组满足指定条件的第一个元素。如果没有找到满足条件的元素,则返回undefined。 7. Array.findIndex(function):返回数组满足指定条件的第一个元素的索引。如果没有找到满足条件的元素,则返回-1。 8. Array.reduce(function):对数组的所有元素执行指定的函数,将它们归纳为一个单一的值。原数组不会被改变。 这些是JavaScript数组的一些常用方法,它们可以帮助我们在处理数组时更加方便和高效。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [js数组常用方法](https://blog.csdn.net/u012451819/article/details/125768796)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值