Spread / Rest 문법

Spread 연산자

• 특정 배열 혹은 객체 값을 복제하는 문법
• 객체 혹은 배열을 펼칠 수 있다
• ... 을 이용해 표현한다.
• immutalbe 해서 기존 배열을 변형시키진 않는다(존의 것은 건들이지 않고 새로운 객체를 만들 때 사용)

function sum (x,y,z) {
  return x + y + z;
}

const numbers = [1,2,3]
sum(...numbers); => 6

const a = {
  one: '1',
  two: '2',
}
const b = {
  ...a,
  three: '3'
}
console.log(b); // { one:'1', two:'2', three:'3' }

Rest(나머지 매개변수) 연산자

• Rest 파라미터(나머지 매개변수) 구문을 구조 분해 할당 문법과 같이 사용하면 나머지 (객체, 배열)을 rest에 담아서 추출할 수있다
• Rest 파라미터(나머지 매개변수) 구문을 사용하면 함수에서 정해지지 않은 수의 매개변수를 배열로 받을 수 있다.
•  함수를 호출할 때 함수의 파라미터(매개변수)를 spread operator(...) 로 작성한 형태다.
• Rest 파라미터를 사용하면 함수의 파라미터로 오는 값들을 모아서 하나의 "배열"로 만들어준다 => 마지막에 나머지 매개변수가 있으면 남아있는 인자들을 배열로 모아준다
• Spread 가 기존의 배열을 펼쳐서 표현한다면, Rest 는 배열이 아닌 개별 요소들을 하나의 배열로 만들어 준다.

const a = {
  blue: '하나',
  purple: '둘'
  red: '셋'
}
const { red, ...res } = a;
console.log(red); // '셋'
console.log(res); // { blue:'하나', purple:'둘' }
// res 안에는 red값을 제외한 값이 들어있다.



const a = [1, 2, 3, 4, 5, 6];
const [ one, ...rest ] = a;
console.log(one); // 1
console.log(rest); // [2, 3, 4, 5, 6]