この記事では、機(jī)能プログラミングの概念を簡単に紹介し、JavaScriptコードの機(jī)能スタイルを改善する5つの方法を説明します。

コアポイント

• 関數(shù)プログラミングは、コマンドリストではなく機(jī)能とそのアプリケーションを使用するプログラミングパラダイムです。それはより抽象的であり、數(shù)學(xué)に由來します。 JavaScriptは、機(jī)能が最初のタイプのオブジェクトであるため、機(jī)能的なプログラミングに特に適しています。
• 純粋な関數(shù)は、機(jī)能プログラミングの重要な部分です。同じ引數(shù)を考えると、それらは常に同じ値を返し、関數(shù)の範(fàn)囲外のものを変更しません。彼らはあなたのコードをポートしてテストしやすくします。
• 機(jī)能プログラミングでは、変數(shù)は変更されていません。変數(shù)を設(shè)定した後、プログラム全體でその狀態(tài)のままである必要があります。これは、constを使用して常に変數(shù)を宣言することで実現(xiàn)できます。
• JavaScriptの機(jī)能プログラミングで矢印関數(shù)と3成分演算子を使用することをお?jiǎng)幛幛筏蓼?。矢印関數(shù)には暗黙の戻り値があり、出力から出力マッピングの視覚化に役立ちます。三元演算子は常に値を返す式であるため、戻り値が存在することを確認(rèn)することが有用です。
• 機(jī)能的プログラミングでの使用を使用することは、それらが可変狀態(tài)に依存するため、避ける必要があります。代わりに、再帰的および高次配列メソッドを使用する必要があります。さらに、タイプの一貫性を維持するために、タイプの強(qiáng)制を避ける必要があります。これは、関數(shù)を宣言する前にタイプの宣言コメントを書くことで実行できます。 for

機(jī)能プログラミングとは何ですか？

命令プログラミング言語で使用されるコマンドのリストではなく、機(jī)能とそのアプリケーションを使用するプログラミングパラダイムです。

この記事の著者は、近年、機(jī)能的なプログラミングに戀をしています。より機(jī)能的なスタイルを促進(jìn)するJavaScriptライブラリを使用し始め、Haskellでコードを書く方法を?qū)Wぶことで深海にまっすぐ飛び込んだ。

Haskellは、ScalaとClojureと同様に、1990年代に開発された純粋に機(jī)能的なプログラミング言語です。これらの言語を使用すると、機(jī)能的なスタイルでエンコードすることを余儀なくされます。 Haskellを?qū)W習(xí)すると、機(jī)能プログラミングのすべての利點(diǎn)についての真の理解が得られます。

JavaScriptは、マルチパラダイム言語です。これは、命令的、オブジェクト指向、または機(jī)能的なスタイルでプログラムするために使用できるためです。ただし、関數(shù)はファーストクラスのオブジェクトであるため、機(jī)能スタイルに特に適合します。つまり、変數(shù)に割り當(dāng)てることができます。これはまた、関數(shù)を他の関數(shù)（通常はコールバックと呼ばれる）の引數(shù)として、または他の関數(shù)の返品値として渡すことができることを意味します。他の関數(shù)を返すか、パラメーターとして他の関數(shù)を受け入れる関數(shù)は、高次関數(shù)と呼ばれ、機(jī)能プログラミングの基本的な部分です。

近年、特に反応の臺(tái)頭後、機(jī)能的なスタイルでJavaScriptをプログラミングすることがますます人気が高まっています。 Reactは、機(jī)能的方法に適した宣言APIを使用するため、機(jī)能的なプログラミング原理をしっかりと把握することで、Reactコードが改善されます。

なぜ機(jī)能プログラミングがそれほど優(yōu)れているのですか？

ルール1：関數(shù)を浄化

• 副作用はありません。これは、関數(shù)が関數(shù)の範(fàn)囲外に変更を加えないことを意味します。これには、グローバル価値の変更、コンソールへの記録、またはDOMの更新が含まれます。
純粋な関數(shù)
• は、少なくとも1つのパラメーターを持っている必要があり、
は値を返す必要があります。慎重に考えると、パラメーターを受け入れない場合、使用するデータはありません。値を返さない場合、関數(shù)のポイントは何ですか？

純粋な関數(shù)は最初は完全に必要ではないように見えるかもしれませんが、不純な関數(shù)を使用するとプログラム全體の変化が生じ、いくつかの深刻な論理エラーが発生します。 例： 不純な関數(shù)では、

に依存します。たとえば、プログラムの後半で

関數(shù)は同じ入力を使用してブール値を返す可能性があります。

// 不純
let minimum = 21;
const checkAge = (age) => age >= minimum;

// 純
const checkAge = (age) => {
    const minimum = 21;
    return age >= minimum;
};

checkAge minimumさて、コードの後半で、minimum関數(shù)がcheckAgeの値を18から18に更新するとします。

次に、次のコードを?qū)g行しているとします：

// 不純
let minimum = 21;
const checkAge = (age) => age >= minimum;

// 純
const checkAge = (age) => {
    const minimum = 21;
    return age >= minimum;
};

同じ入力が與えられているものの、checkAge関數(shù)は異なる値に評(píng)価されます。

純粋な関數(shù)は、パラメーターとして提供される値以外の他の値に依存しないため、コードを簡単に移植できます。返品値が変更されないという事実により、純粋な関數(shù)がテストしやすくなります。

純粋な機(jī)能を一貫して書くことは、突然変異と副作用の可能性も排除します。

変異は機(jī)能プログラミングの大きな赤い旗であり、詳細(xì)を知りたい場合は、JavaScriptの可変割り當(dāng)てと突然変異のガイドでそれらについて読むことができます。

機(jī)能を簡単に移植できるようにするには、機(jī)能が常に純粋であることを確認(rèn)してください。

ルール2：変數(shù)を変更せずに保ちます

変數(shù)の宣言は、プログラマーが學(xué)習(xí)する最初のことの1つです。些細(xì)なことになりますが、機(jī)能的なプログラミングスタイルを使用する場合は非常に重要です。

機(jī)能プログラミングの重要な原則の1つは、変數(shù)が設(shè)定されると、プログラム全體でその狀態(tài)のままになることです。

これは、コード內(nèi)の変數(shù)の再割り當(dāng)て/再件名が災(zāi)害になる可能性のある最も簡単な例です。

checkAge(20); // false

の値は10と11の両方ではありません。 n

checkAge(20); // true

が得られるからです。 x = x 1 xしたがって、Haskellでは、変數(shù)を値に割り當(dāng)ててから別の値に再割り當(dāng)てすることはできません。 JavaScriptでこれを達(dá)成するには、常に0 = 1を使用して変數(shù)を宣言するルールに従う必要があります。

constルール3：矢印関數(shù)を使用します

數(shù)學(xué)では、関數(shù)の概念は、あるセットのセットを別のセットにマッピングするという概念です。次の図は、左側(cè)に設(shè)定された値を右側(cè)に設(shè)定された値にマッピングする関數(shù)を示しています。

この関數(shù)は、矢印関數(shù)を使用してほぼ同じ方法で記述できます。

JavaScriptで機(jī)能スタイルを使用する重要な機(jī)能は、通常の関數(shù)ではなく矢印関數(shù)の使用です。もちろん、これはスタイルに要約されます。通常の関數(shù)の代わりに矢印関數(shù)を使用しても、実際にはコードの「機(jī)能的」の程度には影響しません。

const n = 10;
n = 11; // TypeError: "Attempted to assign to readonly property."

矢印関數(shù)の構(gòu)造 - 特に暗黙の戻り値は、その構(gòu)造が実際に「出力にマッピングされた」：

// 不純
let minimum = 21;
const checkAge = (age) => age >= minimum;

// 純
const checkAge = (age) => {
    const minimum = 21;
    return age >= minimum;
};

特に矢印の関數(shù)を書くときに強(qiáng)調(diào)したいもう1つのことは、三元演算子を使用することです。あなたが三元演算子に慣れていない場合、それらはif...elseのインラインcondition ? value if true : value if falseステートメントです。

それらについての詳細(xì)は、javascriptで三黨のオペレーターを使用する方法：迅速なヒントで読むことができます。

機(jī)能プログラミングで3成分演算子を使用する主な理由の1つは、elseステートメントの必要性です。プログラムは、元の條件が満たされていない場合は何をすべきかを知っている必要があります。たとえば、HaskellはA ステートメントが指定されている場合、エラーが返されます。 elseステートメントではなく、常に値を返す式であることです。これは、矢印の関數(shù)に特に役立ちます。これは、戻り値が存在することを確認(rèn)し、出力マップへの畫像入力を維持できることを意味するためです。聲明と表現(xiàn)の間のニュアンスについて確信が持てない場合は、聲明と表現(xiàn)に関するガイドは読む価値があります。 else

if-else

パラメーターの値に基づいて「eat」または「sleep」の値を返します。

checkAge(20); // false

action矢印表記を使用して関數(shù)の書き込みstate

ステートメントを三元演算子

ルール4：for loop
• if...elseを削除します
プログラミングで

ループ操作さえ持っていないことを最初に発見したとき、標(biāo)準(zhǔn)操作を?qū)g裝する方法を理解するのに苦労しました。ただし、ループが機(jī)能プログラミングに表示されない理由はいくつかあり、ループを使用せずにあらゆるタイプの反復(fù)を?qū)g裝できることをすぐに発見しました。

使用されていないforループがループされる最も重要な理由は、それらが可変狀態(tài)に依存していることです。単純な合計(jì)関數(shù)を見てみましょう：for for forご覧のとおり、

ループで更新される変數(shù)でforを使用する必要があります。

checkAge(20); // true

すべての変數(shù)が不変のコードを書きたい場合は、再帰を使用できます。 for forご覧のとおり、変數(shù)は更新されません。 let

私たちの間の數(shù)學(xué)者は、このコードのすべてが不要であることを明らかに知っているでしょう。しかし、これはループの変動(dòng)性と再帰の違いを説明する素晴らしい方法です。 for ただし、特に配列を扱う場合、再帰は変動(dòng)性問題の唯一の解決策ではありません。 JavaScriptには、変數(shù)を変更せずに配列內(nèi)の値を反復(fù)する多くの組み込みの高次配列メソッドがあります。

アレイ內(nèi)の各値に1を追加する必要があるとします。命令的な方法と

for ただし、JavaScriptの組み込み

// 不純
let minimum = 21;
const checkAge = (age) => age >= minimum;

// 純
const checkAge = (age) => {
    const minimum = 21;
    return age >= minimum;
};

map関數(shù)を見たことがない場合、それは間違いなくそれらについて知っておく価値があります - そして、特にあなたが本當(dāng)に感覚を持っている場合、

checkAge(20); // false

haskellにはまったくmapループがありません。 JavaScriptをより機(jī)能的にするには、再帰的で組み込まれた高次配列メソッドを使用して、filterループの使用を避けてください。

forルール5：spentation < for型宣言を必要としないJavaScriptなどの言語でプログラミングする際のデータ型の重要性を忘れがちです。 JavaScriptで使用される7つのプリミティブデータ型は次のとおりです。

番號(hào) 文字列

boolean

シンボル
bigint
未定義
null
• haskellは、タイプの宣言を必要とする強(qiáng)力な型型言語です。これは、機(jī)能の前に、Hindley-Milnerシステムを使用して、入力とデータ型出力を指定する必要があることを意味します。
• 例：
これは、2つの數(shù)値（xとy）を一緒に追加する非常に単純な関數(shù)です。このような非常に単純な関數(shù)を含むすべての機(jī)能について、プログラムにデータ型を説明しなければならないのは少しばかげているように思えますが、これは最終的に機(jī)能がどのように機(jī)能するか、そしてそれが返されると予想されるものを示すのに役立ちます。これにより、特にコードがより複雑になった場合、コードのデバッグが容易になります。

宣言は次の構(gòu)造に従います

abuse

checkAge(20); // true

接続。 「Hello」5は「hello5」として評(píng)価されますが、これは一貫していません。數(shù)値で文字列を連結(jié)したい場合は、「Hello」文字列（5）を記述する必要があります。

ステートメントの値0はfalseに相當(dāng)します。これにより、數(shù)値データが0に等しいかどうかを確認(rèn)することを無視する怠zyなプログラミング技術(shù)につながる可能性があります。

const n = 10;
n = 11; // TypeError: "Attempted to assign to readonly property."

例：

// 不純
let minimum = 21;
const checkAge = (age) => age >= minimum;

// 純
const checkAge = (age) => {
    const minimum = 21;
    return age >= minimum;
};

checkAge(20); // false

checkAge(20); // true