news 2026/5/1 5:15:42

JavaScript中,什么是函数式编程

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaScript中,什么是函数式编程

JavaScript函数式编程强调使用纯函数、避免副作用和可变数据。


核心概念包括:纯函数(相同输入永远相同输出)、不可变性(创建新对象而非修改原对象)、高阶函数(可接收/返回函数)。


常用工具如数组的map/filter/reduce方法、柯里化和函数组合。


优点是代码更可预测、易测试、可维护,适合数据处理和状态管理。


需注意JavaScript并非纯函数式语言,过度使用可能影响性能。


建议从基础数组方法开始实践,逐步掌握函数式编程思想。


JavaScript中,什么是函数式编程


函数式编程是一种编程范式,强调通过纯函数、避免共享状态和可变数据来构建软件。


在JavaScript中,虽然它是一门多范式语言,但可以应用函数式编程的核心原则来编写更可预测、可测试的代码。


核心概念

  1. 纯函数

    • 相同的输入永远返回相同的输出。

    • 无副作用(不修改外部变量、不改变输入参数等)。

    // 纯函数 const add = (a, b) => a + b; // 非纯函数(有副作用) let counter = 0; const increment = () => counter++; // 修改外部状态
  2. 不可变性

    • 不直接修改数据,而是创建新的副本。

    // 修改数组(非函数式) const arr = [1, 2, 3]; arr.push(4); // 直接修改原数组 // 函数式方式(返回新数组) const newArr = [...arr, 4]; // 使用展开运算符
  3. 函数是一等公民

    • 函数可以像变量一样被赋值、传递或返回。

    const sayHello = () => "Hello"; const greet = sayHello; // 函数作为值传递
  4. 高阶函数

    • 接收函数作为参数,或返回函数。

    // 高阶函数示例:map、filter const numbers = [1, 2, 3]; const doubled = numbers.map(n => n * 2); // 传入函数
  5. 避免共享状态和副作用

    • 减少依赖外部变量,降低代码耦合度。


关联阅读推荐


JavaScript 字符串和数组方法总结(默写版)ES2023新增:toSorted(), toReversed(), toSpliced(), with()


常用函数式编程工具

  • 数组方法map()filter()reduce()find()等。

    const users = [ { name: "Alice", age: 25 }, { name: "Bob", age: 30 } ]; // 链式调用(声明式编程) const names = users .filter(user => user.age > 25) .map(user => user.name);
  • 柯里化

    • 将多参数函数转为单参数函数序列。

    const add = a => b => a + b; const add5 = add(5); // 返回新函数 console.log(add5(3)); // 8
  • 函数组合

    • 将多个函数合并为一个新函数。

    const compose = (f, g) => x => f(g(x)); const toUpperCase = str => str.toUpperCase(); const exclaim = str => str + "!"; const shout = compose(exclaim, toUpperCase); console.log(shout("hello")); // "HELLO!"

优点

  1. 可预测性:纯函数减少不确定性。

  2. 易测试:不依赖外部状态,便于单元测试。

  3. 可维护性:代码简洁、模块化。

  4. 并发友好:避免共享状态,减少竞态条件。


注意事项

  • JavaScript并非纯函数式语言(如Haskell),需手动遵循规则。

  • 过度使用可能影响性能(如大量创建新对象)。

  • 适合数据处理、状态管理等场景,但并非所有场景都需强制使用。


示例对比:命令式 vs 函数式

// 命令式(关注“如何做”) let sum = 0; for (let i = 0; i < arr.length; i++) { sum += arr[i]; } // 函数式(关注“做什么”) const sum = arr.reduce((acc, val) => acc + val, 0);

学习建议

  • mapfilterreduce开始实践。

  • 尝试使用Lodash/fpRamda等函数式工具库。

  • 阅读《JavaScript函数式编程指南》等资源深入理解。


函数式编程在JavaScript中常用于状态管理(如Redux)、数据处理等场景,合理运用能提升代码质量,但需权衡实际需求。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/16 15:56:42

基于springboot 个人记账系统(源码+数据库+文档)

个人记账 目录 基于springboot vue个人记账系统 一、前言 二、系统功能演示 三、技术选型 四、其他项目参考 五、代码参考 六、测试参考 七、最新计算机毕设选题推荐 八、源码获取&#xff1a; 基于springboot vue个人记账系统 一、前言 博主介绍&#xff1a;✌️大…

作者头像 李华
网站建设 2026/4/11 4:22:44

在线考试|基于java + vue在线考试系统(源码+数据库+文档)

在线考试 目录 基于springboot vue在线考试系统 一、前言 二、系统功能演示 三、技术选型 四、其他项目参考 五、代码参考 六、测试参考 七、最新计算机毕设选题推荐 八、源码获取&#xff1a; 基于springboot vue在线考试系统 一、前言 博主介绍&#xff1a;✌️大…

作者头像 李华
网站建设 2026/4/16 13:50:53

springboot养老院管理系统

目录 系统概述核心功能技术特点应用价值 开发技术源码文档获取/同行可拿货,招校园代理 &#xff1a;文章底部获取博主联系方式&#xff01; 系统概述 SpringBoot养老院管理系统是一款基于SpringBoot框架开发的智能化管理平台&#xff0c;旨在优化养老机构的日常运营&#xff0…

作者头像 李华
网站建设 2026/4/24 5:17:58

电流传感器型号从数据库查询并排序输出到网页的方法

最近有个电流传感器网站要做&#xff0c;其中就涉及到产品型号输出排序问题要实现&#xff0c;比如说&#xff0c;一个霍尔电流传感器产品有N多个型号&#xff0c;像这样AN1V 50 PB301 AN1V 100 PB301 AN1V 150 PB301 AN1V 200 PB301 AN1V 250 PB301 AN1V 300 PB301和AN1V 50 P…

作者头像 李华
网站建设 2026/4/25 19:53:14

OpenNana提示词图库:你的AI绘画灵感加速器

在AI绘画创作的世界里&#xff0c;一个绝佳的提示词往往能决定作品的成败。然而&#xff0c;寻找或构思出精准、富有创意的提示词并非易事。为此&#xff0c;OpenNana提示词图库 应运而生——一个专为AI绘画爱好者、设计师与内容创作者打造的灵感库与效率工具。 核心功能与特色…

作者头像 李华
网站建设 2026/4/19 10:35:53

java定做springboot+文具商城系统-vue

目录系统架构设计核心功能模块技术实现要点系统特色功能部署方案开发技术源码文档获取/同行可拿货,招校园代理 &#xff1a;文章底部获取博主联系方式&#xff01;系统架构设计 SpringBoot作为后端框架提供RESTful API&#xff0c;Vue.js作为前端框架构建用户界面。数据库采用…

作者头像 李华