可変長引数とスプレッド構文

はじめに

typescriptを学習していて、可変長引数とスプレッド構文がごちゃごちゃになってしまいそうなので備忘録として残します。

可変長引数とスプレッド構文

可変長引数

可変長引数は、引数として任意の数だけ受け取りそれら配列になる。　
以下だと...argの部分。

  const sum = (...arg: number[]): number => {
    let i = 0;
    for (const num of arg) {
      i += num;
    }
    return i;
  };
  console.log(sum(1, 2, 4));

以下のように通常の引数と併用ができる。

const sum = (base: number, ...arg: number[]): number => {

スプレッド構文

スプレッド構文は、配列の値を取り出す。配列　→　値

  const sum = (...arg: number[]): number => {
    let i = 0;
    for (const num of arg) {
      i += num;
    }
    return i;
  };
  
  const num = [1, 2, 4];
  
  console.log(sum(1, 2, 4)); //7
  console.log(sum(...num)); //7

比較

自分の中では以下のようなイメージです。

・可変長引数：　値　→ 配列
・スプレッド構文：　配列　→ 値

おわりに

まだまだtypescriptの理解ができていないので間違っていたら教えていただけると嬉しいです。