Javascript 高阶函数 filter(), map(), reduce()_.filter( n -> n % 3 == 0).map(n -> n * n).filter(n-CSDN博客

本文深入探讨了JavaScript中的高阶函数概念，通过filter、map和reduce三个核心函数的实例演示，展示了如何利用高阶函数简化代码，提升代码的可读性和效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

高阶函数是一个将一个或多个函数作为参数的函数
也可以理解为:函数需要的参数本身就是函数

高阶函数可以帮助增强你的Javascript,使你的代码简单、简练、可读性强。

1 filter

.filter() 过滤

const nums = [10,20,11,111,222,444,50,40]
let newNum = nums.filter(function(n){
	return n<100
})
console.log(newNum) // [10, 20, 11, 50, 40]
// filter中的回调函数有一个要求 必须返回一个boolen值
// true 函数内部会自动将这次回调的n加入到新的数组中
// false 函数内部会过滤这次n

2 map

map函数的使用 遍历数组

const nums = [10, 20, 11, 50, 40]
let num2 = nums.map(function(n){
	return n*2
})
console.log(num2) // [20, 40, 22, 100, 80]

3 reduce

reduce函数的使用 对数组中的内容进行汇总

const nums = [20, 40, 22, 100, 80]
let total = nums.reduce(function(prevValue,n){
	return prevValue + n
},0)
console.log(total) // 262
// 第一次prevValue是0 因为初始化的值是0
// 第二次prevValue就是上次return的值

结合使用

const nums = [10,20,11,111,222,444,50,40]
let total = nums.filter(n=>{
	return n<100
}).map(n=>{
	return n*2
}).reduce((prevValue,n)=>{
	return prevValue + n
},0)
console.log(total) // 262