JavaScript函数组合_柯里化与管道操作符

function add(a, b, c) {
  return a + b + c;
}

function curryAdd(a) {
  return function(b) {
    return function(c) {
      return a + b + c;
    };
  };
}

curryAdd(1)(2)(3); // 6
</font>
</p>
<p>也可以写一个通用的柯里化函数：</p>
<font face="Courier New">
<pre class="brush:php;toolbar:false;">
function curry(fn) {
  return function curried(...args) {
    if (args.length >= fn.length) {
      return fn.apply(this, args);
    } else {
      return function (...nextArgs) {
        return curried.apply(this, args.concat(nextArgs));
      };
    }
  };
}

const curriedAdd = curry(function(a, b, c) {
  return a + b + c;
});

curriedAdd(1, 2, 3); // 6
curriedAdd(1)(2, 3); // 6
curriedAdd(1)(2)(3); // 6
</font>
</p>

<H3>函数组合：将多个函数串联成新函数</H3>
<p>函数组合（Function Composition）是指将多个函数连接起来，前一个函数的输出作为下一个函数的输入。常见的组合方式是从右到左执行（数学中的 f ∘ g）。</p>
<p>实现一个组合函数 <strong>compose</strong>：</p>
<font face="Courier New">
<pre class="brush:php;toolbar:false;">
function compose(...fns) {
  return function(value) {
    return fns.reduceRight((acc, fn) => fn(acc), value);
  };
}

const toUpper = str => str.toUpperCase();
const exclaim = str => str + '!';
const sayHello = name => `hello ${name}`;

const greet = compose(exclaim, toUpper, sayHello);
greet('john'); // "HELLO JOHN!"
</font>
</p>
<p>执行顺序是：<strong>sayHello → toUpper → exclaim</strong>。</p>

<H3>管道操作符：从左到右的数据流处理</H3>
<p>管道（Pipeline）与组合相反，它是从左到右执行函数链。虽然 JavaScript 原生的管道操作符（|>）还处于提案阶段，但我们可以用函数模拟其行为。</p>
<p>实现一个 <strong>pipe</strong> 函数：</p>
<font face="Courier New">
<pre class="brush:php;toolbar:false;">
function pipe(...fns) {
  return function(value) {
    return fns.reduce((acc, fn) => fn(acc), value);
  };
}

const greet = pipe(
  sayHello,
  toUpper,
  excl<a style="color:#f60; text-decoration:underline;" title="ai" href="https://www.php.cn/zt/17539.html" target="_blank">ai</a>m
);

greet('john'); // "HELLO JOHN!"

'john'
  |> sayHello
  |> toUpper
  |> exclaim
  |> console.log; // 输出: HELLO JOHN!