JavaScriptの純粋関数とは?特徴とサンプルコードでわかりやすく解説
純粋関数(Pure Function)とは
純粋関数とは、決定論的(deterministic)な関数のことです。つまり、同じ入力を渡せば、何度実行しても必ず同じ出力が返ってくる関数を指します。これは数学でいう「well-defined function(明確に定義された関数)」と同じ概念です。
純粋関数には、主に次の3つの特徴があります。
自分自身の引数だけに依存する
スコープ外の変数を変更しようとしない
副作用(side effect)を一切生まない
逆に言えば、これらの条件をひとつでも満たしていない関数は「不純な(impure)関数」とみなされます。
純粋関数ではない例(1):外部変数への依存
次のコードは純粋関数ではありません。関数が自分の引数ではなく、スコープ外にある変数(val1 と val2)に依存しているためです。外部の変数値が変われば、同じように呼び出しても異なる結果が返ってしまいます。
<html>
<body>
<script>
let val1 = 6;
let val2 = 4;
function multiply() {
return val1 * val2;
}
document.write(multiply());
</script>
</body>
</html>
出力
24
純粋関数ではない例(2):引数と外部変数の両方に依存
次の例も純粋関数ではありません。引数を受け取ってはいるものの、それ以外に外部で宣言された変数(val)にも依存しています。val の値が変われば、同じ引数を渡しても結果が変わってしまうためです。
<html>
<body>
<script>
let val = 100;
function multiply(arg) {
return val * arg;
}
document.write(multiply(2));
</script>
</body>
</html>
出力
200
純粋関数の例
一方、次のコードは純粋関数です。処理に使われているのは自分の引数だけで、外部変数は一切登場しません。そのため、同じパラメータを渡せば、いつ・どこで呼び出しても必ず同じ結果が返ります。
<html>
<body>
<script>
function multiply(arg) {
return 4 * arg;
}
document.write(multiply(2));
</script>
</body>
</html>
出力
8
純粋関数が重視される理由
純粋関数には、実務上さまざまなメリットがあります。
テストが容易:入力と出力の対応が固定されているため、単体テストが書きやすい
予測しやすい:外部状態の影響を受けないため、バグの原因を特定しやすい
キャッシュ(メモ化)できる:同じ入力なら同じ結果になるため、計算結果を再利用できる
並列処理に安全:共有状態を変更しないため、並行実行しても競合が起きない
React をはじめとするモダンなフロントエンド開発や関数型プログラミングでは、この純粋関数の考え方が設計の土台になっています。可能な限り処理を純粋関数として切り出すことで、保守性と信頼性の高いコードを実現できます。
-
JavaScriptの関数式(Function Expression)とは?特徴と使い方を解説
JavaScriptにおける関数式(Function Expression)とは、関数を変数に代入して定義する方法のことです。代入された関数は、その変数名を使って後から呼び出すことができます。 関数式の主な特徴 関数を変数に格納し、変数名を指定して呼び出せる 通常の関数宣言(function declaration)と異なり、ホイスティング(巻き上げ)が行われないため、定義よりも前に呼び出すことはできない 多くの場合、名前を持たない「無名関数(匿名関数)」として定義される コールバック関数や即時実行関数(IIFE)など、さまざまな場面で活用できる この「ホイスティングされない」という点が重
-
JavaScriptのクロージャとは?仕組みと実装例をわかりやすく解説
クロージャとはJavaScriptにおけるクロージャ(Closure)とは、外側の関数の実行が完了して値を返した後であっても、内側の関数から外側の関数のスコープ(変数)にアクセスできる仕組みのことです。言い換えれば、内側の関数は、外側の関数の変数に対して常にアクセスできるということです。この性質を活用することで、データを外部から直接操作されないように隠蔽したり、関数の呼び出し間で状態を保持する処理を実現したりすることが可能になります。クロージャのサンプルコード以下は、JavaScriptでクロージャを使用した具体的なコード例です。ボタンをクリックすると、クロージャによって保持された値を使って2