스프레드 연산자와 레스트 연산자는 둘다 ... 점 3개로 이루어진 연산자인데, 어디에서 사용하는지에 따라 스프레드 또는 레스트라고 부른다.

📚 Spread Operator(스프레드 연산자)

: 배열의 요소나 객체의 프로퍼티를 나누는 데 사용
(Used to split up array elements OR object properties)

배열

const newArray = [...oldArray, 1, 2];

• oldArray 배열의 모든 요소를 꺼내서 새로 생성한 newArray 배열에 추가하고, 요소 1과 요소 2도 추가

예

객체

const newObject = {...oldObject, newProp: 5};

• oldObject객체의 모든 프로퍼티와 값 꺼내서 새로운 newObject 객체에 추가하고, newProp도 추가한다.
• oldObject객체에 newProp이라는 프로퍼티가 기존에 있다면 새로 넣어주는 값으로 대체된다.

예

스프레드 연산자를 사용하여 배열을 쉽게 복사하고, 안전하게 이전 객체를 복사하여 새로운 객체에 프로퍼티를 추가할 수 있다.

📚 Rest Operator(레스트 연산자)

: 함수의 인자 목록을 배열로 병합하는 데 사용
(Used to merge a list of function arguments into an array)

(참고)
arguments(인자)는 함수에 전달되는 인수들을 배열 형태로 나타낸 객체

function sortArgs(...args) {
  return args.sort();
}

• sortArgs는 인자를 무제한으로 받는다.
• 인자가 몇 개든지, ...args라고 쓴다. 1개 이상의 인자를 가져도 모두 배열로 통합된다.
• 그런 다음 인자 목록에 배열 메소도를 적용하거나, 무엇이든 원하는 방법으로 인자를 저장할 수 있다.

예

• checkNumbers 함수를 만들고, 인자를 모두 받아들인 후 하나의 배열로 통합할 수 있도록 ...를 사용하여 인자에 레스트 연산자를 사용한다.
• 반환 값에 인자 배열에 필터를 돌려서 요소들 중 1이 있는지 찾아보자.
• checkNumbers 함수에 1,2,3,4 인자를 보내고 콘솔에 찍어보면, [1] 이 있다고 출력된다.

  (참고)
  ===는 타입과 값이 같은지 체크한다.