배열에 원소 추가: unshift, ...array, push

배열에 원소를 추가할 때 unshift를 쓰곤 한다.

arr = [2, 3, 4]
arr.unshift(1)
arr.unshift(0)

console.log(arr) // [0, 1, 2, 3, 4]

그러나 unshift는 다음과 같이 배열의 값을 직접 참조하여 원본 배열에 변형을 일으키는데,

불변성의 이슈에서나 성능 상의 이유에서나 좋지 못하다.

arr = [2, 3, 4]
// 0: 2, 1: 3, 2: 4

arr.unshift(1)
// 0: 1, 1: 2, 2: 3, 3: 4

arr.unshift(0)
// 0: 0, 1: 1, 2: 2, 3: 3, 4: 4

 

그러나 전개연산자를 이용하면 불변성, 성능 이슈를 모두 잡을 수 있다.

arr = [2, 3, 4]
new_arr = [0, 1, ...arr]

console.log(new_arr) // [0, 1, 2, 3, 4]

전개연산자는 얕은 복사를 이용하기 때문에

다음과 같이 arr의 메모리를 참조하여 원본배열의 변형없이,

그리고 unshift과 같이 불필요한 연산없이 한 번의 선언으로 원하는 배열을 생성할 수 있다