新しいデフォルト値の入れ方
- カテゴリ:
- JavaScript
- コメント数:
- Comments: 0
◆ [a = "default"] = []
JavaScript で undefined や null だった場合のデフォルト値を設定したいとき
と書きますよね
|| は JavaScript ユーザなら当たり前のように書くもので すごく便利なものです
ですが 式が長くなった場合には見づらくなるし () が必須になったり () なかったら読みづらいこともあって常に使えるかというとそうでもないと思います
また || 演算子は false なら右側を評価するので undefined のときのみにしたいというときは使えません
型をうまく使って false なら = undefined なら になるようにしていても 仕方なく if 文にしないといけないときもあるものです
ですが ES6 の分割代入を使えば!
false のときは false になります
さらに 左辺の側に初期値もかけるので 見やすくなってると思います
欠点は 右辺に [] が必要になることと 速度面で || より劣りそうというくらい
0 や false や空文字でもデフォルト値を設定したいか undefined のときだけ設定したいかで使い分けるとよさそうです
function fn(val){
return val
}
var x = fn() || "default"
var x2 = fn(1) || "default"
console.log(x)
// default
console.log(x2)
// 1
return val
}
var x = fn() || "default"
var x2 = fn(1) || "default"
console.log(x)
// default
console.log(x2)
// 1
と書きますよね
|| は JavaScript ユーザなら当たり前のように書くもので すごく便利なものです
ですが 式が長くなった場合には見づらくなるし () が必須になったり () なかったら読みづらいこともあって常に使えるかというとそうでもないと思います
また || 演算子は false なら右側を評価するので undefined のときのみにしたいというときは使えません
型をうまく使って false なら = undefined なら になるようにしていても 仕方なく if 文にしないといけないときもあるものです
ですが ES6 の分割代入を使えば!
var [y = "default"] = [fn()]
var [y2 = "default"] = [fn(false)]
console.log(y)
// default
console.log(y2)
// false
var [y2 = "default"] = [fn(false)]
console.log(y)
// default
console.log(y2)
// false
false のときは false になります
さらに 左辺の側に初期値もかけるので 見やすくなってると思います
欠点は 右辺に [] が必要になることと 速度面で || より劣りそうというくらい
0 や false や空文字でもデフォルト値を設定したいか undefined のときだけ設定したいかで使い分けるとよさそうです