複数の戻り値を返す方法 | 引数と戻り値 | JavaScript 超完全入門 基本から発展までのすべて

スポンサーリンク
スポンサーリンク

複数の戻り値とは？

JavaScriptの関数は通常、1つの値しか返すことができません。しかし、複数の戻り値が必要な場合、配列やオブジェクトを使って、複数の値をまとめて返すことができます。これにより、1つの関数から複数の結果を効率的に返すことが可能になります。

配列を使って複数の戻り値を返す方法

配列を使うと、複数の値を順番に返すことができます。呼び出し元では、その配列から個々の値を取り出して利用することが可能です。

配列を使った複数の戻り値の例

function getCoordinates() {
    let x = 10;
    let y = 20;
    return [x, y];
}

const [x, y] = getCoordinates();
console.log(x);  // 10 を出力
console.log(y);  // 20 を出力

この例では、関数getCoordinatesがxとyの2つの座標値を配列で返しています。呼び出し側では、配列の分割代入を使って個々の値にアクセスしています。

オブジェクトを使って複数の戻り値を返す方法

オブジェクトを使うと、複数の戻り値に名前を付けて返すことができます。これにより、戻り値が何を意味しているのかが明確になり、特に多くの値を返す場合に役立ちます。

オブジェクトを使った複数の戻り値の例

function getUserInfo() {
    let name = "Taro";
    let age = 25;
    return { name, age };
}

const { name, age } = getUserInfo();
console.log(name);  // "Taro" を出力
console.log(age);  // 25 を出力

この例では、getUserInfo関数がnameとageをオブジェクトの形式で返しています。呼び出し側では、オブジェクトの分割代入を使って個々のプロパティにアクセスしています。

配列とオブジェクトを使った応用例

複数の値を配列やオブジェクトにまとめて返す方法は、実際のアプリケーションで非常に役立ちます。たとえば、計算結果やユーザー情報、データベースからの複数の結果などを1つの関数から効率的に返すことができます。

複合的な応用例

function processUserData() {
    let userName = "Hanako";
    let userAge = 30;
    let scores = [85, 90, 88];
    return {
        userName,
        userAge,
        scores
    };
}

const { userName, userAge, scores } = processUserData();
console.log(userName);  // "Hanako" を出力
console.log(userAge);  // 30 を出力
console.log(scores);  // [85, 90, 88] を出力

この例では、関数processUserDataがユーザーの名前、年齢、スコアのリストをオブジェクトとして返しています。呼び出し側では、オブジェクトの分割代入を使って各値に簡単にアクセスできます。

まとめ

JavaScriptでは、1つの関数から複数の値を返すために配列やオブジェクトを利用することが一般的です。配列を使うと、順番に値を返すことができ、オブジェクトを使うと、名前付きで値を返すことができます。これにより、関数が返すデータの構造を柔軟に管理でき、可読性やメンテナンス性が向上します。アプリケーションのニーズに応じて、配列やオブジェクトを使い分けると良いでしょう。

スポンサーリンク