未経験からエンジニアになりたい人必見!
おすすめプログラミングスクール3選!

【JavaScript】argumentsオブジェクトで関数に渡された値を取得する方法

本記事では、JavaScriptのargumentsオブジェクトの使い方について解説しています。

JavaScriptの学習におすすめ参考書
改訂新版JavaScript本格入門

参考書が苦手な人はUdemyの動画がおすすめ
ガチで学びたい人のためのJavaScriptメカニズム

作成者 CodeMafia
学習時間 20.5時間
受講者数 16,593人
レビュー (2,383件)

argumentsオブジェクトとは?

argumentsオブジェクトとは、関数内でしか使うことができない特殊なオブジェクトです。

JavaScript
function sample() {
  console.log(arguments); // -> OK
}

console.log(arguments); // -> Uncaught ReferenceError: arguments is not defined

関数で引数を使う場合、基本は引数の数と関数呼び出し時に渡す値の数は同じにするのがベストです。その理由は引数の数が少ないと、関数呼び出しで渡した値がどの引数にも渡されず無いものとされ、引数の数が多いとundefinedが代入されてしまいます。

このような関数呼び出し時に渡す値が決まっていない時にargumentsオブジェクトを使うと、渡された値を全て取得でき、undefinedのいらない情報を除外することができます。

argumentsオブジェクトの使い方

argumentsオブジェクトで渡された値の数を取得する

argumentsオブジェクトを使って渡された値の数を取得するには、lengthプロパティを使います。

JavaScript
arguments.length

実際にarguments.lengthで渡された値の数を取得してみましょう。

JavaScript
function sample() {
  console.log(arguments.length);
}

sample(); // -> 0
sample(1); // -> 1
sample(true, false); // -> 2
sample("A", "B", "C"); // -> 3

argumentsオブジェクトで渡された値を取得する

argumentsオブジェクトで渡された値は配列として一つずつ格納されます。値を取り出すには通常の配列と同様に[インデックス番号]で取り出します。

JavaScript
function sample() {
  for (let i = 0; i < arguments.length; i++) {
    console.log(`arguments[${i}]の値:${arguments[i]}`);
  }
}

sample("A"); // -> arguments[0]の値:A
sample("B", "C"); // -> arguments[0]の値:A arguments[1]の値:C
sample("D", "E", "F"); // -> arguments[0]の値:D arguments[1]の値:E arguments[2]の値:F

argumentsオブジェクトはアロー関数で使うことができない

argumentsオブジェクトは便利なオブジェクトですが、アロー関数で使うことができません。

アロー関数でargumentsオブジェクトを使うとエラー「Uncaught ReferenceError: arguments is not defined」が表示されます。

JavaScript
const sample = () => {
  console.log(arguments); // -> Uncaught ReferenceError: arguments is not defined
};

sample("A");