JavaScript 関数のデフォルト引数のサンプル

JavaScriptの関数のデフォルト引数のサンプルです。

確認環境
・Windows10
・Google Chrome

目次

関数のデフォルト引数

コード

関数のデフォルト引数のサンプルです。

<script>

num = test1();

console.log(num); //6

function test1(a=1,b=2,c=3){
	return a + b + c;
}

</script>

3行目の関数呼び出しは、引数を指定していません
7行目は、デフォルト引数を使用しています。
5行目は、デフォルト引数の値で計算されて6になります。

 

一部のみにデフォルト引数を設定

関数のデフォルト引数は、右の引数から順に指定します。
関数の呼び出し側の引数は関数の引数の左からセットされます。
関数の引数に値が渡されなかった場合の値はundefinedになります。

コード

一部のみにデフォルト引数を設定するサンプルです。

<script>

num1 = test1(1);

console.log(num1); //6

function test1(a,b=2,c=3){
	return a + b + c;
}

num2 = test2(1);

console.log(num2); //NaN

function test2(a,b=2,c){
console.log(a);//1
console.log(b);//2
console.log(c);//undefined
	return a + b + c;
}
</script>

3行目の引数は1つだけです。
7行目はbとcのみデフォルト引数としています。
5行目は、3行目の引数はaにセットされ結果6が表示されます。

11行目は、15行目の関数を呼んでいます。
15行目の引数は、右端のCにデフォルト引数がありません。11行目の引数はaにセットされます。
18行目の引数の値を渡されなかった変数cは、undefinedになっています。

 

デフォルト値がある箇所に引数を設定

デフォルト値がある箇所に引数を設定する場合、関数呼び出し側の引数が設定されます。
関数の呼び出し側の引数は関数の引数の左からセットされます。

コード

デフォルト値がある箇所に引数を設定するサンプルです。

<script>

num = test5(5,6);

console.log(num); //14

function test5(a=1,b=2,c=3){
	return a + b + c;
}

</script>

3行目は、引数を2つ設定しています。
7行目は、3つの引数にデフォルト引数が設定されています。引数は、aは5、bは6、cは3でセットされます。

関連の記事

JavaScript 関数のサンプル
JavaScript 再帰関数のサンプル
JavaScript 無名関数(アロー関数式)と即時関数のサンプル
JavaScript クロージャのサンプル
JavaScript 引数/戻り値が関数のサンプル(高階関数)

△上に戻る