Javascript - spread / rest

ㅂㅈㄷㅂ123·2022년 7월 13일
0
post-thumbnail

비슷한 두 문법

  • ...기호는 두 가지 용법으로 쓰인다.
  • Spread Operator 와 Rest Parameter이다.
  • 비슷하게 생겼기 때문에 혼란스럽다.
  • 따라서 잘 정리해두어야 하는 개념이라 생각한다.

spread 문법

let arr1 = [1, -2, 3, 4];
let arr2 = [8, 3, -8, 1];

alert( Math.max(...arr1, ...arr2) ); // 8

let arr = [3, 5, 1];
let arr2 = [8, 9, 15];

<예제1>
let merged = [0, ...arr, 2, ...arr2];
alert(merged);  // 0,3,5,1,2,8,9,15 (0, then arr, then 2, then arr2)

<예제2>
let merged = [0, arr, ...arr2]
alert(merged); //0, [3, 5, 1], 8, 9, 15

이렇게 값으로 들어오는 것.

rest 문법

function sumAll(...args) { // args is the name for the array
  let sum = 0;

  for (let arg of args) sum += arg;

  return sum;
}

alert( sumAll(1) ); // 1
alert( sumAll(1, 2) ); // 3
alert( sumAll(1, 2, 3) ); // 6

이렇게 파라미터로 들어오는 것

정리

Rest parameter가 이름을 배신하고 함수 인자가 아닌 곳에 사용되면 헷갈림을 유발할 수 있다.

  • spread operator는 펼치고, rest parameter는 모은다.
  • spread operator는 주는 쪽이고, rest parameter는 받는 쪽이다.
  • spread operator는 기존의 변수를 사용하고, rest parameter는 새로운 변수를 만든다.
profile
ㅂㅈㄷㅂㅈㄷ

0개의 댓글

관련 채용 정보