JavaScript における関数合成

JavaScriptJavaScriptBeginner
今すぐ練習

This tutorial is from open-source community. Access the source code

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

この実験では、JavaScript における関数合成の概念を探ります。複数の関数を組み合わせて新しい関数を作成する方法と、compose() 関数を使用して右から左への関数合成を行う方法を学びます。実践的な例と演習を通じて、この強力な技術とそのプログラミングにおける実際の応用について、より深い理解を得ます。


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-28208{{"JavaScript における関数合成"}} javascript/data_types -.-> lab-28208{{"JavaScript における関数合成"}} javascript/arith_ops -.-> lab-28208{{"JavaScript における関数合成"}} javascript/comp_ops -.-> lab-28208{{"JavaScript における関数合成"}} javascript/higher_funcs -.-> lab-28208{{"JavaScript における関数合成"}} javascript/spread_rest -.-> lab-28208{{"JavaScript における関数合成"}} end

JavaScript で関数を合成する方法

JavaScript で関数合成を使ってコーディングを練習するには、ターミナル/SSH を開いて node と入力します。

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

  1. Array.prototype.reduce() を使って右から左への関数合成を行います。
  2. 最後の(最も右の)関数は 1 つ以上の引数を受け取ることができます。残りの関数は単項関数でなければなりません。
  3. 任意の数の関数を引数として取り、それらを合成する新しい関数を返す compose 関数を定義します。
  4. 必要な関数を必要な順序で compose 関数に渡します。
  5. 必要な引数を使って新しい合成関数を呼び出します。
const compose = (...fns) =>
  fns.reduce(
    (f, g) =>
      (...args) =>
        f(g(...args))
  );

たとえば、2 つの関数があるとしましょう。

const add5 = (x) => x + 5;
const multiply = (x, y) => x * y;

これらの関数を compose を使って合成することができます。

const multiplyAndAdd5 = compose(add5, multiply);

これで、必要な引数を使って multiplyAndAdd5 を呼び出すことができます。

multiplyAndAdd5(5, 2); // 15

まとめ

おめでとうございます!関数を合成する実験を完了しました。技術力を向上させるために、LabEx でさらに実験を行って練習してください。