JavaScriptのデフォルト引数の設定方法【現役エンジニアが解説】
今回は、JavaScriptのデフォルト引数の設定方法について、実践的な書き方と限定された書き方に分け、簡単に解説していきます。
実践的な書き方
JavaScriptでデフォルト引数を設定する場合は分岐処理が必要です。
引数の中身がundefinedであれば、その引数にデフォルトの設定を行います。
function Hello(name) { if (name === undefined) { name = "名無し"; } console.log(name+"さん、こんにちは。"); } Hello("田中"); // 田中さん、こんにちは。 Hello(); // 名無しさん、こんにちは。
上記のコードのような分岐処理によって、デフォルト引数を設定することができます。
限定された書き方
IE非対応でも問題がなければ、簡単にデフォルト引数を設定できます。
引数の横に代入演算子(=)と値を書くことでデフォルト引数の設定を行います。
function Hello(name = "名無し") { console.log(name+"さん、こんにちは。"); } Hello("田中"); // 田中さん、こんにちは。 Hello(); // 名無しさん、こんにちは。
上記のコードのname=”名無し”のように、引数の設定と同時にデフォルト引数の設定を行うことができます。
名前付き引数の書き方
IE非対応になりますが、名前付き引数(デフォルト引数含む)を設定できます。
名前付き引数は引数全体を連想配列にし、代入演算子(=)と値で各要素のデフォルト引数を設定可能です。
function Hello( {name = "名無し", title = "さん"} ) { console.log(name+title+"、こんにちは。"); } Hello({title:"様",name:"田中"}); // 田中様、こんにちは。 Hello({}); // 名無しさん、こんにちは。
上記のコードのように、名前付き引数にすることによって、引数の順番が不問となり、さらに引数を指定しないことも可能になります。