引数のデフォルト値とは？
JavaScriptでは、関数に引数を渡さなかった場合や、未定義の値が引数として渡された場合に、あらかじめ指定されたデフォルト値を使うことができます。これにより、関数が適切に動作するための値を設定でき、引数が不足していてもエラーを防ぐことができます。
引数のデフォルト値を設定する方法
引数にデフォルト値を設定するには、関数の定義時に引数に対して初期値を指定します。デフォルト値が設定された引数は、呼び出し時にその引数が渡されなかった場合に自動的にその初期値が使用されます。
デフォルト値を持つ関数の例
function greet(name = "Guest") {
console.log("Hello, " + name + "!");
}
// 引数を渡さない場合
greet(); // "Hello, Guest!" を出力
// 引数を渡す場合
greet("Taro"); // "Hello, Taro!" を出力この例では、greet関数にnameという引数があり、そのデフォルト値として"Guest"が指定されています。greet()を呼び出す際に引数を渡さなければ、"Hello, Guest!"が出力され、引数を渡した場合はその値が使用されます。
複数の引数に対するデフォルト値
複数の引数に対しても、それぞれにデフォルト値を設定することができます。引数の一部だけが渡された場合、デフォルト値が設定されている引数には初期値が使用されます。
複数の引数にデフォルト値を設定した例
function createUser(name = "Guest", age = 20) {
console.log("Name: " + name + ", Age: " + age);
}
// すべての引数をデフォルト値で使用
createUser(); // "Name: Guest, Age: 20" を出力
// 1つだけ引数を渡す
createUser("Taro"); // "Name: Taro, Age: 20" を出力
// すべての引数を渡す
createUser("Hanako", 30); // "Name: Hanako, Age: 30" を出力この例では、createUser関数に2つの引数nameとageがあり、それぞれデフォルト値が設定されています。引数をすべて渡さない場合でも、指定されたデフォルト値が使用されます。
デフォルト値の動的な設定
デフォルト値は、他の変数や関数の結果を使って動的に設定することもできます。たとえば、デフォルト値を計算した結果や、関数の内部で生成された値に基づいて設定することが可能です。
動的なデフォルト値の例
function calculateDiscount(price, discount = price * 0.1) {
return price - discount;
}
console.log(calculateDiscount(100)); // 90 を出力
console.log(calculateDiscount(100, 20)); // 80 を出力この例では、calculateDiscount関数のdiscount引数が、priceを基に計算された値としてデフォルトで設定されています。discountが指定されない場合、自動的にpriceの10%が割引として適用されます。
デフォルト値とundefined
引数にundefinedが渡された場合、デフォルト値が適用されます。しかし、nullが渡された場合はデフォルト値は無視され、そのままnullが使用されます。
undefinedとnullの扱いの例
function greet(name = "Guest") {
console.log("Hello, " + name + "!");
}
greet(undefined); // "Hello, Guest!" を出力
greet(null); // "Hello, null!" を出力この例では、undefinedが渡された場合、デフォルト値の"Guest"が使用されますが、nullが渡された場合はそのままnullが使用されます。
まとめ
JavaScriptでは、関数の引数にデフォルト値を設定することで、引数が渡されなかった場合でも適切な値を使用して関数を実行することができます。デフォルト値は、固定の値だけでなく、動的に計算された値や他の変数を基に設定することも可能です。また、undefinedが渡された場合はデフォルト値が適用され、nullが渡された場合はそのままnullが使用されます。これにより、関数の柔軟性が高まり、コードの堅牢性が向上します。