js高阶函数之用reduce实现map

本文详细解析了JavaScript中的高阶函数reduce和map的工作原理及应用。reduce方法通过执行reducer函数将数组元素汇总为单一值,而map方法则用于创建新数组,其元素是原数组元素经函数处理后的结果。

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

加深对高阶函数reduce和map实现原理的理解

高阶函数:
函数中可以传入另一个函数作为参数的函数

map介绍

map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一次提供的函数后的返回值。

语法:


var new_array = arr.map(function callback(currentValue, index, array) {},thisArg)

参数:
callback:生成新数组元素的函数,使用三个参数:
currentValue:callback 数组中正在处理的当前元素。
index(可选):callback 数组中正在处理的当前元素的索引。
array(可选):map方法调用的数组。
thisArg(可选):执行 callback 函数时值被用作this。

map常见用法举例

const arr = [1, 4, 9, 16];

const map = arr.map(x => x * 2); //数组元素均乘2
console.log(map); // [2, 8, 18, 32]

reduce介绍

reduce方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。

语法:


const result = arr.reduce(func(pre, curr, index, array) {}, initialValue)

参数:
func: 执行数组中每个值 (如果没有提供 initialValue则第一个值除外)的函数
pre: 累计器累计回调的返回值; 它是上一次调用回调时返回的累积值,或initialValue(初始值)。
curr: 数组中正在处理的元素。
index(可选): 数组中正在处理的当前元素的索引。 如果提供了initialValue,则起始索引号为0,否则从索引1起始。
array(可选): 调用reduce()的数组
initialValue(可选): 作为第一次调用 callback函数时的第一个参数(pre)的值。 如果没有提供初始值,则将使用数组中的第一个元素。

reduce常见用法举例:

const arr = [1, 4, 9, 16];

const reduce = arr.reduce((pre,curr) => pre+curr); //求和
console.log(reduce); // 1+4+9+16 = 30
/*执行情况
1.pre = 1,curr = 4; (没有提供初始值initialValue,pre = arr[0])
2.pre = 5, curr = 9;
3.pre = 14, curr = 16;
4.pre = 30;(最终return的值)

用reduce实现map:

Array.prototype.myMap = function(fn, thisArg) {
	var res = [];
	thisArg = thisValue || [];
	return this.reduce(function(pre, cur, index, arr) {
	    return res.push(fn.call(thisArg, cur, index, arr));
	}, []);
	return res;
}

参考文档:MDN中的reduce方法
参考文档:MDN中的map方法

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值