전개연산자(Spread Operator)

전개 연산자는 배열데이터의 대괄호([])를 날려주고, 객체데이터의 중괄호({})를 날려준다.

예를 들어,

// 배열데이터 대괄호 날려버리깅~
const a = [1, 2, 3]

console.log(...a) // 1, 2, 3

// 또 다른 예,
const a = [1, 2, 3]
const b = [4, 5, 6]
const c = [a, b]
const d = [...a, ...b]

console.log(c) // [[1, 2, 3], [4, 5, 6]]
console.log(d) // [1, 2, 3, 4, 5, 6]

// tmi, 같은 결과 내려면
const c = a.concat(b)
console.log(c) // [1, 2, 3, 4, 5, 6]
-----------------------------------------------
// 객체데이터 중괄호 날려버리깅~
const a = { x: 1, y: 2 }
const b = { y: 3, z: 4 }
const c = { …a, …b }

console.log(c) // { x:1, y:3, z:4 } (객체 데이터 각각의 속성은 고유해야해서, y는 덮어쓰기됨)

// tmi, 같은 결과 내려면
const c = Object.assign({}, a, b)
console.log(c) // { x:1, y:3, z:4 }

꽤나 유용해보이는데, 얻다 쓰냐면

// 함수 fn 정의
function fn(x, y, z) {
  console.log(x, y, z)
}

const a = [1, 2, 3]

// 일 때, fn에 a의 1, 2, 3 세 개 값을 넣어서 실행하고 싶을때
// 전개 연산자 안쓰면
fn(a[0], a[1], a[2])

// 전개 연산자 쓰면
fn(…a)

짠. 매우 짧게 전달가능