rest, spread構文について

Question

Udemyの講座のカリキュラム内のコードなのですが、上のコードが下のコードにリファクタ出来ていることになっているのですが、何故こうなるのかが分からないです。

どうしてa, b, c, d, e　が　...rest に変わるのでしょうか。

function unshift(array, a, b, c, d, e) {
  return [a, b, c, d, e].concat(array);
}

function unshift(array, ...rest) {
  return [ ...rest, ...array ];
}

Answer 1

リファクタ出来ていることになっているのですが、何故こうなるのかが分からないです。

他の方が回答しているようにリファクタは出来ていないのですがそれは置いといて、このように書き換えられる理由は残余引数とスプレッド構文という記述方法がjavascriptに存在するからです。

残余引数 - JavaScript | MDN

スプレッド構文 - JavaScript | MDN

Answer 2

上のコードが下のコードにリファクタ出来ていることになっているのですが

両者は動作が違います。ちょうど6つの引数を渡したときは両者の動作は一致しますが、そうでない場合には動作が一致しません。

• ...restのほう…引数の個数に関わらず、最初1個以外の引数はすべてrestに配列として入るので、それにarrayを連結する
• a, b, c, d, eのほう…引数が多ければ余った分は無視されるし、足りなければ不足分はundefinedで埋められる

Comments

[maisumakun]

もっとも、元のコードの動作が望ましいという状況も少ないかとは思います。

Answer 3

もとの処理はこうしないと

function unshift1(array) {
  var args=[].map.call(arguments,function(x){return x});
  return args.concat(args.shift());
}
console.log(unshift1([1,2,3],4,5,6,7,8));