JavaScript 高阶函数：函数式编程的瑞士军刀
大家好，我是今天的主讲人，叫我老王就行。今天咱们聊聊 JavaScript 里那些让你感觉“哇，原来还能这么玩！”的高阶函数，以及它们在函数式编程中搞的那些“花活儿”——函数组合和柯里化。
准备好了吗？咱们这就开始！
什么是高阶函数？别怕，没那么玄乎
高阶函数（Higher-Order Functions），听起来是不是感觉很高大上？其实简单得很，就俩条件：
- 能接收函数作为参数。
- 能返回一个函数。
满足其中一个，或者两个都满足，它就是个高阶函数。就像你既会做饭，又会洗碗，那你就比只会做饭或者只会洗碗的人“高阶”一点。
举个栗子：
function 问好(问候语) {
return function(名字) {
return 问候语 + '，' + 名字 + '！';
};
}
const 早上好 = 问好('早上好');
const 晚上好 = 问好('晚上好');
console.log(早上好('老王')); // 输出: 早上好，老王！
console.log(晚上好('小李')); // 输出: 晚上好，小李！在这个例子中，问好 函数接收一个 问候语 作为参数，并返回一个新的函数。这个新的函数接收一个 名字 作为参数，然后返回一个拼接好的问候语。所以，问好 就是一个高阶函数，因为它返回了一个函数。
再来一个：
function 数组处理器(数组, 处理函数) {
const 结果 = [];
for (let i = 0; i < 数组.length; i++) {
结果.push(处理函数(数组[i]));
}
return 结果;
}
function 平方(数字) {
return 数字 * 数字;
}
const 数字数组 = [1, 2, 3, 4, 5];
const 平方数组 = 数组处理器(数字数组, 平方);
console.log(平方数组); // 输出: [1, 4, 9, 16, 25]在这个例子中，数组处理器 函数接收一个数组和一个处理函数作为参数。它遍历数组，并对每个元素应用处理函数，然后返回一个新的数组。所以，数组处理器 也是一个高阶函数，因为它接收了一个函数作为参数。
看到了吧，高阶函数并没有那么神秘。你可能每天都在用，只是没意识到而已。 JavaScript 内置的 map、filter、reduce 等等，全都是高阶函数。
高阶函数的设计思想：解耦，解耦，还是解耦！
高阶函数的核心设计思想是解耦。 啥意思？就是把不同的功能模块拆分开来，让它们之间互相独立，互不影响。
想象一下，你有一台榨汁机。如果你想榨苹果汁，你就把苹果放进去；如果你想榨橙汁，你就把橙子放进去。榨汁机本身并不关心你放的是什么水果，它只负责榨汁。
高阶函数也是一样。它不关心你传给它的函数是用来做什么的，它只负责执行这个函数。这样，我们就可以把榨汁机（高阶函数）和水果（具体函数）分开来，分别进行维护和修改。
好处是什么呢？
- 代码更灵活： 我们可以随时替换不同的函数，而不需要修改高阶函数本身。
- 代码更可复用： 我们可以把高阶函数应用到不同的场景中，只需要传入不同的函数即可。
- 代码更易于维护： 我们可以把不同的功能模块拆分开来，分别进行维护和修改，减少了代码之间的耦合度。
函数组合 (Function Composition)：搭积木式的编程
函数组合是一种将多个函数组合成一个新函数的技术。就像搭积木一样，我们可以把小的积木（函数）组合成大的积木（新函数）。
举个栗子：
假设我们有三个函数：
加倍(x): 将数字乘以 2。平方(x): 将数字平方。加一(x): 将数字加 1。
如果我们想先将一个数字加倍，然后平方，最后加 1，我们可以这样写：
const 数字 = 5;
const 结果 = 加一(平方(加倍(数字))); // 51但是，这样写代码看起来很乱，而且可读性很差。如果函数更多，嵌套的层数更深，代码就会变得更加难以维护。
这时候，函数组合就派上用场了。我们可以定义一个 组合 函数，用来将多个函数组合成一个新函数：
function 组合(...函数列表) {
return function(初始值) {
return 函数列表.reduceRight((累积值, 函数) => 函数(累积值), 初始值);
};
}
const 加倍平方加一 = 组合(加一, 平方, 加倍);
const 结果 = 加倍平方加一(5); // 51在这个例子中，组合 函数接收一个函数列表作为参数，并返回一个新的函数。这个新的函数接收一个初始值作为参数，然后从右到左依次执行函数列表中的函数，并将结果作为下一个函数的输入。
代码解释：
...函数列表: 使用剩余参数语法，将传入的函数列表收集到一个数组中。函数列表.reduceRight((累积值, 函数) => 函数(累积值), 初始值): 使用reduceRight方法从右到左依次执行函数列表中的函数。累积值: 上一个函数执行的结果。函数: 当前要执行的函数。初始值: 初始值，也就是第一个函数的输入。函数(累积值): 执行当前函数，并将累积值作为输入。=> 函数(累积值): 返回当前函数执行的结果，作为下一个函数的累积值。
好处是什么呢？
- 代码更简洁： 我们可以用更少的代码实现相同的功能。
- 代码更可读： 我们可以更容易理解代码的意图。
- 代码更可复用： 我们可以将不同的函数组合成不同的新函数，而不需要修改原来的函数。
更通用的组合函数：
上面的 组合 函数只能处理接收单个参数的函数。如果我们要处理接收多个参数的函数，我们需要对 组合 函数进行修改：
function 组合(...函数列表) {
return function(...参数) {
return 函数列表.reduceRight((累积值, 函数) => {
return Array.isArray(累积值) ? 函数(...累积值) : 函数(累积值);
}, 参数);
};
}
function 连接(字符串1, 字符串2) {
return 字符串1 + 字符串2;
}
function 转大写(字符串) {
return 字符串.toUpperCase();
}
const 连接转大写 = 组合(转大写, 连接);
const 结果 = 连接转大写('hello', ' world'); // HELLO WORLD在这个例子中，我们使用了 Array.isArray 方法来判断累积值是否是一个数组。如果是数组，说明上一个函数返回了多个值，我们需要将这些值作为参数传递给下一个函数。
柯里化 (Currying)：让函数更“懒”一点
柯里化是一种将接收多个参数的函数转换成一系列接收单个参数的函数的技术。就像把一个大包裹拆成多个小包裹，每次只处理一个小包裹。
举个栗子：
假设我们有一个函数 加法(x, y)，用来计算两个数字的和：
function 加法(x, y) {
return x + y;
}
const 结果 = 加法(2, 3); // 5我们可以将 加法 函数柯里化，变成一个接收单个参数的函数，并返回一个新的函数：
function 柯里化加法(x) {
return function(y) {
return x + y;
};
}
const 加2 = 柯里化加法(2);
const 结果 = 加2(3); // 5在这个例子中，柯里化加法 函数接收一个参数 x，并返回一个新的函数。这个新的函数接收一个参数 y，然后返回 x + y 的结果。
更通用的柯里化函数：
上面的 柯里化加法 函数只能处理接收两个参数的函数。如果我们要处理接收多个参数的函数，我们可以定义一个通用的 柯里化 函数：
function 柯里化(函数) {
return function curried(...参数) {
if (参数.length >= 函数.length) {
return 函数(...参数);
} else {
return function(...更多参数) {
return curried(...参数, ...更多参数);
};
}
};
}
function 连接三个字符串(字符串1, 字符串2, 字符串3) {
return 字符串1 + 字符串2 + 字符串3;
}
const 柯里化连接三个字符串 = 柯里化(连接三个字符串);
const 连接Hello = 柯里化连接三个字符串('Hello');
const 连接HelloWorld = 连接Hello(' World');
const 结果 = 连接HelloWorld('!'); // Hello World!代码解释：
function curried(...参数): 定义一个名为curried的内部函数，使用剩余参数语法，将传入的参数收集到一个数组中。if (参数.length >= 函数.length): 判断传入的参数数量是否大于等于函数的参数数量。- 如果大于等于，说明所有的参数都已经传入，我们可以直接执行函数。
- 如果小于，说明还有参数没有传入，我们需要返回一个新的函数，等待更多的参数传入。
return function(...更多参数): 返回一个新的函数，使用剩余参数语法，将传入的更多参数收集到一个数组中。return curried(...参数, ...更多参数): 将之前的参数和新的参数合并起来，递归调用curried函数。
好处是什么呢？
- 代码更灵活： 我们可以分步传递参数，而不需要一次性传递所有的参数。
- 代码更可复用： 我们可以创建一些预设了部分参数的函数，方便在不同的场景中使用。
- 延迟执行： 柯里化可以让我们延迟执行函数，直到所有的参数都准备好。
柯里化和函数组合的结合：
柯里化和函数组合可以结合起来使用，创造出更加强大的功能。
例如，我们可以使用柯里化来创建一些预设了部分参数的函数，然后使用函数组合将这些函数组合成一个新的函数：
const 加法 = 柯里化((x, y) => x + y);
const 乘法 = 柯里化((x, y) => x * y);
const 加1再乘2 = 组合(乘法(2), 加法(1)); // 先加1，再乘以2
console.log(加1再乘2(3)); // (3 + 1) * 2 = 8总结：高阶函数是函数式编程的基石
高阶函数是 JavaScript 函数式编程的重要组成部分。它们通过解耦代码，提高代码的灵活性、可复用性和可维护性。
函数组合和柯里化是两种常用的函数式编程技术，它们可以帮助我们更好地利用高阶函数，编写出更加简洁、可读、可复用的代码。
用表格总结一下今天讲的内容：
| 特性 | 高阶函数 | 函数组合 | 柯里化 |
|---|---|---|---|
| 定义 | 接收函数作为参数，或者返回一个函数的函数。 | 将多个函数组合成一个新函数。 | 将接收多个参数的函数转换成一系列接收单个参数的函数。 |
| 核心思想 | 解耦，将不同的功能模块拆分开来。 | 将小的函数组合成大的函数，像搭积木一样。 | 让函数更“懒”一点，分步传递参数。 |
| 优点 | 代码更灵活、可复用、易于维护。 | 代码更简洁、可读、可复用。 | 代码更灵活、可复用、延迟执行。 |
| 示例 | map, filter, reduce |
const 加倍平方加一 = 组合(加一, 平方, 加倍); |
const 柯里化加法 = 柯里化(加法); |
希望今天的讲座能帮助大家更好地理解 JavaScript 高阶函数，以及它们在函数式编程中的作用。
记住，编程就像做菜，掌握了基本的技巧和工具，你就能做出各种美味佳肴。高阶函数就是 JavaScript 函数式编程的瑞士军刀，掌握了它，你就能写出更加优雅、高效的代码。
谢谢大家！下次再见！