◆ 引数にデフォルト引数や分割代入機能を組み合わせすぎるとわけわからなくなる
最近の JavaScript は引数にデフォルト値や分割代入の機能が使えて便利です
かといってできること引数で全部やろうとすると引数定義がすごく複雑になります

例えばこんなのもおっけいです

function fn({opt: {x, y} = {y: 2}, ...z} = {opt: {x: 1}}){
logonerror(e => console.log(opt))
logonerror(e => console.log(x))
logonerror(e => console.log(y))
logonerror(e => console.log(z))
}

引数の数が多い関数だともっとすごいことになったこともあります
あまり複雑になるようなら関数内で昔ながらの初期化をしたほうが見やすいかもしれませんね

くいず

ところで↑の関数に対して↓を実行するとそれぞれどうなるでしょう

console.log("-- fn() ------------------------------")
fn()

console.log("-- fn(1) -----------------------------")
fn(1)

console.log("-- fn({}) ----------------------------")
fn({})

console.log(`-- fn({foo: "bar"}) ------------------`)
fn({foo: "bar"})

console.log("-- fn({opt: null}) -------------------")
fn({opt: null})

console.log("-- fn({opt: {x: 100}}) ---------------")
fn({opt: {x: 100}})

console.log("-- fn({opt: {y: 200}}) ---------------")
fn({opt: {y: 200}})

console.log("-- fn({opt: {x: 100, y: 200}}) -------")
fn({opt: {x: 100, y: 200}})

logonerror は関数実行時にエラーがでたらログしてそのままつづけるためのものです
中身はこれだけ

function logonerror(fn){
try{
return fn()
}catch(err){
console.log(err.message)
}
}

こたえ

-- fn() ------------------------------
opt is not defined
1
undefined
{}
-- fn(1) -----------------------------
opt is not defined
undefined
2
{}
-- fn({}) ----------------------------
opt is not defined
undefined
2
{}
-- fn({foo: "bar"}) ------------------
opt is not defined
undefined
2
{foo: "bar"}
-- fn({opt: null}) -------------------
Uncaught TypeError: Cannot destructure property `x` of 'undefined' or 'null'.
-- fn({opt: {x: 100}}) ---------------
opt is not defined
100
undefined
{}
-- fn({opt: {y: 200}}) ---------------
opt is not defined
undefined
200
{}
-- fn({opt: {x: 100, y: 200}}) -------
opt is not defined
100
200
{}