JavaScript中什么是高阶函数_map_filter如何使用-js教程-PHP中文网

JavaScript中什么是高阶函数_map_filter如何使用

夢幻星辰

发布： 2025-12-17 22:33:07

原创

132人浏览过

高阶函数是接收函数作为参数的函数，如map、filter、reduce、sort等；filter筛选返回true的元素生成新数组，map将每个元素映射为新值生成等长新数组，二者均不修改原数组且可链式调用。

javascript中什么是高阶函数_map_filter如何使用

高阶函数就是把函数当参数传进去的函数。map、filter 是最常用也最典型的两个，它们不改原数组，只返回新数组，逻辑清晰、写法简洁。

什么是高阶函数

只要一个函数接收另一个函数作为参数，它就是高阶函数。比如：
red">`array.filter(callback)` 中的 filter 就是高阶函数，因为它把 callback 当参数用了。
类似还有 map、reduce、sort（传比较函数时）等。

filter：筛选符合条件的元素

它遍历数组，对每个元素执行回调函数，只保留返回 true 的那些元素，组成新数组。

回调函数必须返回布尔值：true 留下，false 跳过
不改变原数组，也不处理空数组
常用场景：找偶数、找大于某值的数、筛选对象列表（如 status === 'active'）

例子：

const nums = [5, 12, 8, 23, 4];<br>
const evens = nums.filter(n => n % 2 === 0); // [12, 8, 4]

登录后复制

map：对每个元素做变换

它把数组每个元素“映射”成新值，一一对应生成新数组，长度和原数组一致。

回调函数返回什么，新数组就放什么
常用于格式转换：数字翻倍、转字符串、提取对象字段（如 users.map(u => u.name)）
同样不修改原数组

例子：

const prices = [19.99, 29.99, 9.99];<br>
const withTax = prices.map(p => parseFloat((p * 1.1).toFixed(2))); // [21.99, 32.99, 10.99]

登录后复制

map 和 filter 可以链式调用

因为都返回新数组，所以能连着写，代码更紧凑：

动态WEB网站中的PHP和MySQL：直观的QuickPro指南第2版

动态WEB网站中的PHP和MySQL详细反映实际程序的需求，仔细地探讨外部数据的验证(例如信用卡卡号的格式)、用户登录以及如何使用模板建立网页的标准外观。动态WEB网站中的PHP和MySQL的内容不仅仅是这些。书中还提到如何串联JavaScript与PHP让用户操作时更快、更方便。还有正确处理用户输入错误的方法，让网站看起来更专业。另外还引入大量来自PEAR外挂函数库的强大功能，对常用的、强大的包

525

查看详情

立即学习“Java免费学习笔记（深入）”；

先 filter 挑出数据，再 map 加工
比如：找出价格大于 15 的商品，然后只取它们的名字

例子：

const items = [{name:'book', price:12}, {name:'pen', price:25}, {name:'note', price:18}];<br>
const names = items.filter(i => i.price > 15).map(i => i.name); // ['pen', 'note']

登录后复制

基本上就这些。不用记太多规则，记住核心：filter 是“挑”，map 是“变”，两者都安全、纯函数、易组合。

以上就是JavaScript中什么是高阶函数_map_filter如何使用的详细内容，更多请关注php中文网其它相关文章！