関数から複数の値を呼び出し元へ返す

関数のブロック内で return 文を使うことで関数から呼び出し元へ値を返すことができますが、 JavaScript では戻り値に指定できる値は一つだけです。そこで戻り値に配列を指定することで複数の値を戻り値に返す方法について解説します。

(Last modified: )

関数から複数の値を呼び出し元へ返す

関数の定義では return 文の値に戻り値を記述することで関数の呼び出し元へ値を返すことができます。

function 関数名(仮引数1, 仮引数2, ...){
  実行される処理;
  ...

  return 戻り値;
}

ただ戻り値には値を一つしか記述できませんので、複数の値を呼び出し元へ返すことはできません。その為、返したい複数の値を要素として持つ配列を作成した上で配列を戻り値として指定します。

次のサンプルを見てください。

function maxAndMin(num1, num2, num3){
  const maxNum = Math.max(num1, num2, num3);
  const minNum = Math.min(num1, num2, num3);

  return [maxNum, minNum];
}

let numArray = maxAndMin(10, 7, 14);

console.log("Max = " + numArray[0]);
>> Max = 14
console.log("Min = " + numArray[1]);
>> Min = 7

今回のサンプルでは関数で受け取った 3 つの引数の中で一番大きい値と一番小さい値を取得し、それぞれの値を要素として持つ配列を戻り値として指定しています。関数を呼びだした側では関数から返された配列の要素を参照してそれぞれコンソールに出力しています。

このように呼び出し元へ返したい値をいったん配列の要素として格納することで、複数の値を呼び出し元へ返すことができます。

配列の分割代入を利用する

配列の分割代入とは、配列の各要素を異なる変数にそれぞれ代入したい場合に利用できる構文です。書式は次のとおりです。

[変数名1, 変数名2, ...] = 配列;

配列の各要素の値を、左辺に記述した変数にひとつずつ代入します。

分割代入を使わない場合、それぞれの変数に対して配列の要素を個別に代入する必要があります。

let personal = ['Yamada', 10, 'Tokyo'];

let name = personal[0];
let old = personal[1];
let address = personal[2];

配列の分割代入を使うと次のようにまとめて記述することができます。

let personal = ['Yamada', 10, 'Tokyo'];
let [name, old, address] = personal;

関数からの戻り値が配列だった場合に、この配列の分割代入を利用して関数からの戻り値を複数の変数にまとめて代入することができます。先ほどのサンプルを次のように書き換えてみます。

function maxAndMin(num1, num2, num3){
  const maxNum = Math.max(num1, num2, num3);
  const minNum = Math.min(num1, num2, num3);

  return [maxNum, minNum];
}

let [maxResult, minResult] = maxAndMin(10, 7, 14);

console.log("Max = " + maxResult);
>> Max = 14
console.log("Min = " + minResult);
>> Min = 7

関数から返された配列の各要素の値を、どんな値が格納されているのかわかりやすい名前をつけた変数にまとめて格納することで、プログラムをより分かりやすくすることができます。

-- --

JavaScript で戻り値に配列を指定することで複数の値を戻り値に返す方法について解説しました。

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。