객체나 배열에 있는 값을 펼쳐준다.

const sedanCar = {
  type: "sedan"
};

const bmw = {
  type: "sedan",
  madeIn: "germany",
  name: "bmw 320d"
};

const honda = {
  type: "sedan",
  madeIn: "japan",
  name: "CR-V"
};

// type이 모두 sedan. 중복된코드...

console.log(bmw); // {type: "sedan", madeIn: "germany", name: "bmw 320d"}
console.log(honda); // {type: "sedan", madeIn: "japan", name: "CR-V"}

spread 를 이용한다면?

객체를 펼쳐주므로 …sedanCar 를 하면, sedanCar에 있는 값들이 객체로 들어가게 된다.

const sedanCar = {
  type: "sedan"
};

const bmw = {
  ...sedanCar,
  madeIn: "germany",
  name: "bmw 320d"
};

const honda = {
  ...sedanCar,
  madeIn: "japan",
  name: "CR-V"
};

console.log(bmw); // {type: "sedan", madeIn: "germany", name: "bmw 320d"}
console.log(honda); // {type: "sedan", madeIn: "japan", name: "CR-V"}

마찬가지로 배열도 가능하다.

const sedanCar = ["bmw 320d", "CR-V", "GV80", "말리부"];
const suvCar = ["코란도", "투싼", "산타페"];

const allCar = [...sedanCar, ...suvCar, "페라리"];

console.log(allCar); //["bmw 320d", "CR-V", "GV80", "말리부", "코란도", "투싼", "산타페", "페라리"]