JavaScript函数式编程是一种以函数为核心的编程范式，强调将计算过程拆分为可复用的纯函数，避免共享状态和可变数据，从而让代码逻辑更清晰、副作用更易控制。这种范式在前端复杂状态管理、数据处理场景中应用十分广泛。
函数式编程的核心思想
纯函数
纯函数是函数式编程的基石，它需要满足两个条件：相同的输入永远返回相同的输出，并且在执行过程中不产生任何可观察的副作用，比如修改外部变量、发起网络请求、操作DOM等。
下面的代码展示了纯函数和非纯函数的区别：
// 纯函数：输入相同返回值一定相同，无副作用
function add(a, b) {
return a + b;
}
// 非纯函数：依赖外部变量，相同输入可能返回不同结果
let base = 10;
function addWithBase(a) {
return a + base;
}
// 非纯函数：有修改外部状态的副作用
let count = 0;
function increment() {
count++;
return count;
}
不可变数据
函数式编程要求数据一旦创建就不能被修改，如果需要变更数据，应该返回一个全新的数据副本，而不是直接修改原数据。这样可以避免因为数据被意外修改导致的逻辑错误，也方便做状态追踪和回溯。
比如操作数组时，不要使用push、splice等会修改原数组的方法，而是使用concat、扩展运算符等返回新数组的方法：
const arr = [1, 2, 3]; // 错误做法：修改原数组 arr.push(4); // 正确做法：返回新数组，原数组不变 const newArr = [...arr, 4];
函数是一等公民
在JavaScript中，函数可以像普通变量一样被传递、赋值、作为返回值，这就是函数是一等公民的体现。这个特性让我们可以很方便地实现高阶函数、函数组合等模式。
常用实践技巧
函数柯里化
柯里化是把接受多个参数的函数转换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且返回结果的新函数的技术。它可以让我们提前固定部分参数，生成更专用的函数。
下面是一个通用的柯里化实现：
function curry(fn) {
return function curried(...args) {
// 如果传入的参数数量已经达到原函数的参数长度，直接执行原函数
if (args.length >= fn.length) {
return fn.apply(this, args);
}
// 否则返回一个新函数，等待接收剩余参数
return function(...restArgs) {
return curried.apply(this, args.concat(restArgs));
};
};
}
// 测试柯里化
function multiply(a, b, c) {
return a * b * c;
}
const curriedMultiply = curry(multiply);
console.log(curriedMultiply(1)(2)(3)); // 输出6
console.log(curriedMultiply(1, 2)(3)); // 输出6
函数组合
函数组合是把多个小函数组合成一个新函数的过程，数据会从右到左（或者从左到右，看实现方式）依次经过各个函数处理，每个函数的输出作为下一个函数的输入。它可以让我们把复杂的逻辑拆分成多个单一职责的小函数，再组合起来使用。
下面是一个从左到右的函数组合实现：
function compose(...fns) {
return function(x) {
return fns.reduce((acc, fn) => fn(acc), x);
};
}
// 定义小函数
function double(x) {
return x * 2;
}
function addOne(x) {
return x + 1;
}
function square(x) {
return x * x;
}
// 组合函数：先乘2，再加1，再平方
const process = compose(square, addOne, double);
console.log(process(3)); // 先3*2=6，再6+1=7，再7*7=49，输出49
使用高阶函数处理数据
JavaScript内置的数组方法map、filter、reduce都是典型的高阶函数，它们接收函数作为参数，非常适合用来做数据转换和筛选，避免写命令式的循环逻辑。
比如下面的场景：从用户列表中筛选出成年用户，再提取他们的名字，最后拼接成字符串：
const users = [
{ name: '张三', age: 17 },
{ name: '李四', age: 20 },
{ name: '王五', age: 22 }
];
const result = users
.filter(user => user.age >= 18) // 筛选成年用户
.map(user => user.name) // 提取名字
.reduce((str, name) => str + name + '、', '') // 拼接字符串
.slice(0, -1); // 去掉最后的顿号
console.log(result); // 输出李四、王五
实践注意事项
虽然函数式编程有很多优点，但也不需要强行在所有场景使用。比如简单的循环逻辑用命令式写法可能更直观，过度使用柯里化、函数组合反而会让代码可读性下降。实际开发中可以根据场景灵活选择，把函数式编程的思想和命令式、面向对象的思想结合起来，写出更合适的代码。
另外，频繁创建数据副本会带来一定的性能开销，在性能敏感的场景（比如大数组的频繁操作）需要注意评估，必要时可以做适当的优化，比如使用结构共享的不可变数据库来减少性能损耗。
JavaScript函数式编程纯函数柯里化函数组合修改时间：2026-06-10 14:42:43