【JS応用｜豆知識】JavaScriptのMath.maxで「最大値取得」をスマートに！配列処理の落とし穴も徹底解説

導入

JavaScriptで数値の最大値を取得したいとき、真っ先に思い浮かぶのがMath.max関数です。しかし、単純な数値の比較だけでなく、配列を扱う際に「思った通りの結果にならない」と悩んだ経験はありませんか？本記事では、Math.maxの基本から、開発現場で避けては通れない「配列展開」のテクニックまでを解説します。この知識があれば、条件分岐だらけの冗長なコードを一行でスッキリ書けるようになります。

基礎知識

Math.maxは、引数として渡された0個以上の数値の中から、最も大きい数値を返す組み込み関数です。引数を何も渡さない場合は「-Infinity」を返し、数値ではない値が含まれると「NaN（Not a Number）」を返します。重要なポイントは、この関数が「数値のリスト」を期待しているという点です。そのため、配列をそのまま渡しても最大値は判定できません。

実装/解決策

配列の中にある最大値を取得するには、ES6から導入されたスプレッド構文（…）を使用するのが現代的な標準です。スプレッド構文は、配列の中身をバラバラの引数として展開してくれるため、Math.maxに直接配列を渡すことが可能になります。また、非常に大きな配列を扱う場合は、メモリ消費を抑えるためにreduceメソッドを使う手法も有効です。

サンプルプログラム

以下のコードをブラウザのコンソールやNode.js環境で実行してみてください。

// 1. 基本的な使い方
const maxVal = Math.max(10, 50, 30);
console.log(maxVal); // 50

// 2. 配列をスプレッド構文で処理する（推奨）
const numbers = [1, 8, 3, 9, 2];
const maxInArray = Math.max(...numbers);
console.log(maxInArray); // 9

// 3. reduceを使った安全な最大値取得
// 配列が空の場合や非常に大きい場合にエラーを防ぎます
const safeMax = numbers.reduce((acc, curr) => Math.max(acc, curr), -Infinity);
console.log(safeMax); // 9

応用・注意点

現場で注意すべき点は、スプレッド構文のスタックサイズ制限です。JavaScriptエンジンには、関数に渡せる引数の数に上限があります。数万件以上の要素を持つ巨大な配列に対して「…numbers」を実行すると、「Maximum call stack size exceeded」というエラーが発生する可能性があります。

数千件程度のデータであればスプレッド構文で問題ありませんが、それ以上のデータを扱う場合は、先述したreduceメソッドの使用を強く推奨します。また、配列内に数値以外の文字列などが混入していると、結果がNaNになってしまうため、事前にfilterやmapを用いてデータのクレンジング（数値のみへの変換）を行うことを忘れないようにしましょう。