こんにちは、Ryohei(@ityryohei)です!

本記事では、JavaScript配列から最小値・最大値を取得する方法をご紹介しています。

JavaScriptで配列から最小値と最大値を取得したいな。良い方法ないかな?

上記の疑問にお答えします。

では、解説していきます。

最大値・最小値の取得方法について

JavaScriptで最大値・最小値を取得するには、Mathオブジェクトのmin()max()を使用します。これらのメソッドは、引数に渡された値が数値であればメソッドに応じて最小値もしくは最大値を返し、値が数値でない場合はNaN(Not-A-Number) を返します。

console.log(Math.min(1, 2, 3, 4, 5)); //1
console.log(Math.max(1, 2, 3, 4, 5)); //5

引数に配列を指定することはできないですが、複数の数値を指定することができます。なので配列から最小値・最大値を取得したい場合は少し工夫が必要になります。

配列から最小値・最大値を取得する

配列から最小値・最大値を取得する方法は複数選択肢がありますが、ここでは下記を使用した方法をご紹介しています。

  • スプレッド構文
  • apply()

スプレッド構文

スプレッド構文は、配列などの変数の直前に...を指定することで内容を自動展開してくれる構文です。引数の配列にスプレッド構文を指定すると、配列内容を展開し、すべての値を関数に渡すことができます。

Mathオブジェクトのmin()max()では、引数に複数の数値が必要です。なので、引数にスプレッド構文で配列を指定することで、配列の値をすべて渡し、最小値・最大値の値を取得することができます。

const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

console.log(Math.min(...array)); //1
console.log(Math.max(...array)); //10

参考:スプレッド構文 - JavaScript | MDN

apply()

apply()は、thisを指定し、処理を実行するメソッドです。関数に配列として値をまとめて渡すことができるため、ループ文を省略することができます。

const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

console.log(Math.min.apply(null, array)); //1
console.log(Math.max.apply(null, array)); //10

参考:Function.prototype.apply() - JavaScript | MDN

これで配列から最小値・最大値の要素を取得することができます。

最後に

配列から最小値・最大値を取得する場合、ループ処理や配列の内容をすべて参照することができるメソッドであれば実現できます。ここではソースでよく見かけるMathオブジェクトを使用した方法をご紹介させていただきましたが、他にも良い方法が見つかれば記事に追記し、共有していきたいと思います。

以上、JavaScriptで配列から最小値・最大値を取得する方法のご紹介でした!

この記事を書いた人

Ryohei

Webエンジニア / ブロガー

福岡のWeb制作会社に務めるWebエンジニアです。エンジニア歴は10年程で、好きな言語はPHPとJavaScriptです。本サイトは私がインプットしたWebに関する知識を整理し、共有することを目的に2015年から運営しています。Webに関するご相談があれば気軽にお問い合わせください。

JavaScriptを基礎からしっかりと学びたい方へ

下記の参考書がおすすめです。私がJavaScript入門時に購入した書籍で、基礎から応用まで多様なサンプルを用いて解説されています。ページ数は多いですが、内容が伴っているのですらすら読めます。腰を据えて学びたい方に最良の一冊となっています。