Spread 연산자

const cookie = {
  base: 'coockie',
  madIn: 'korea',
};
const chocochipCookie = {
  base: 'coockie',
  madIn: 'korea',
  toping: 'chocochip',
};
const blueberryCookie = {
  base: 'coockie',
  madIn: 'korea',
  toping: 'blueberry',
};
const strawberryCookie = {
  base: 'coockie',
  madIn: 'korea',
  toping: 'strawberry',
};

다양한 종류의 쿠키 객체를 만들때 중복된 key값이 있을 경우 스프레드 연산자 ...를 통해 간단하게 작성할 수 있다.

const cookie = {
  base: 'coockie',
  madIn: 'korea',
};
const chocochipCookie = {
  ...cookie,
  toping: 'chocochip',
};
const blueberryCookie = {
  ...cookie,
  toping: 'blueberry',
};
const strawberryCookie = {
  ...cookie,
  toping: 'strawberry',
};

console.log(chocochipCookie);
console.log(blueberryCookie);
console.log(strawberryCookie);

{ base: 'coockie', madIn: 'korea', toping: 'chocochip' }
{ base: 'coockie', madIn: 'korea', toping: 'blueberry' }
{ base: 'coockie', madIn: 'korea', toping: 'strawberry' }

이처럼 스프레드 연산자 ...는 객체의 값을 새로운 객체에 펼쳐준다.

const noTopingCookies = ['촉촉한쿠키', '안촉촉한쿠키'];
const topingCookies = ['바나나쿠키', '블루베리쿠키', '딸기쿠키', '초코칩쿠키'];

const allCookies = [...noTopingCookies, ...topingCookies];
console.log(allCookies);

[ '촉촉한쿠키', '안촉촉한쿠키', '바나나쿠키', '블루베리쿠키', '딸기쿠키', '초코칩쿠키' ]

배열에서도 마찬가지로 스프레드 연산자를 사용할 수 있다.