JavaScript の関数合成 | コーディングチュートリアル

はじめに

この実験では、JavaScript における関数合成の概念を探ります。具体的には、composeRight 関数に焦点を当てます。この関数を使うと、複数の関数を左から右に実行される単一の関数に結合できます。実際の例を通じて、関数合成がコードを簡素化し、よりモジュール化する方法を見ていきましょう。

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28597{{"関数を左から右に合成する"}} javascript/data_types -.-> lab-28597{{"関数を左から右に合成する"}} javascript/arith_ops -.-> lab-28597{{"関数を左から右に合成する"}} javascript/comp_ops -.-> lab-28597{{"関数を左から右に合成する"}} javascript/higher_funcs -.-> lab-28597{{"関数を左から右に合成する"}} javascript/spread_rest -.-> lab-28597{{"関数を左から右に合成する"}} end

関数合成の逆順

コーディングを練習するには、ターミナル/SSH を開き、node と入力します。

以下は、左から右への関数合成を行う方法です。

Array.prototype.reduce() メソッドを使って、左から右への関数合成を行います。
最初の（最も左の）関数は 1 つ以上の引数を受け取ることができますが、残りの関数は単項関数でなければなりません。

const composeRight = (...fns) =>
  fns.reduce(
    (f, g) =>
      (...args) =>
        g(f(...args))
  );

例えば：

const add = (x, y) => x + y;
const square = (x) => x * x;
const addAndSquare = composeRight(add, square);
addAndSquare(1, 2); // 9

まとめ

おめでとうございます！あなたは逆順合成関数の実験を完了しました。あなたの技術を向上させるために、LabEx でさらに多くの実験を練習することができます。