모던 자바스크립트 Deep Dive

[TIL/모던 자바스크립트 Deep Dive] 2023/08/02

Array.prototype.shift 🟣shift 메서드는 원본 배열에서 첫 번째 요소를 제거하고, 제거한 요소를 반환한다. 원본 배열이 빈 배열이면 undefined를 반환한다. 이때, shift 메서드는 원본 배열을 직접 변경한다.shift 메서드와 push 메

2023년 8월 2일1min read

27장. 배열 🟢

27-8. 배열 메서드 🟡

Array.prototype.shift 🟣

shift 메서드는 원본 배열에서 첫 번째 요소를 제거하고, 제거한 요소를 반환한다. 원본 배열이 빈 배열이면 undefined를 반환한다. 이때, shift 메서드는 원본 배열을 직접 변경한다.

shift 메서드와 push 메서드를 사용하면 큐를 쉽게 구현할 수 있다. ``큐(queue)``는 데이터를 마지막에 밀어 넣고, 처음 데이터, 즉 가장 먼저 밀어 넣은 데이터를 먼저 꺼내는 선입 선출(FIFO - First In First Out) 방식의 자료구조다.

큐(queue) 역시, 생성자 함수와 클래스로 직접 구현하는 부분이 있는데, 스택과 함께 향후에 정리하도록 하겠다.

Array.prototype.concat 🟣

concat 메서드는 인수로 전달된 값들(배열 또는 원시값)을 원본 배열의 마지막 요소로 추가한 새로운 배열을 반환한다. 인수로 전달한 값이 배열인 경우 배열을 해체하여 새로운 배열의 요소로 추가한다. 이때, 원본 배열은 변경되지 않는다. 코드를 살펴보자.

push와 unshift 메서드는 concat 메서드로 대체할 수 있다. 다만 미묘한 차이가 존재한다. 책에서는 그러한 차이에 대해서 다음과 같이 설명한다.

- push와 unshift 메서드는 원본 배열을 직접 변경하지만 concat 메서드는 원본 배열을 변경하지 않고 새로운 배열을 반환한다. 따라서 push와 unshift 메서드를 사용할 경우 원본 배열을 반드시 변수에 저장해 두어야 하며 concat 메서드를 사용할 경우 반환값을 반드시 변수에 할당받아야 한다.

위 문장을 읽고 솔직히 의아했다. ~~그래서 뭐 어쩌라는거지?~~

그런데 곰곰이 생각해보니, 위 문장이 본질이었다. ``코드의 예측 가능성을 높이기 위한, 데이터의 불변성 유지``에 관한 정수를 담은 문장이다.

배열을 인수로 전달받는 case에서는 다음과 같은 차이가 있다.

concat 메서드 역시 스프레드 문법으로 대체할 수 있다.

결론적으로, 여러 메서드를 우후죽순으로 사용하는 대신 스프레드 문법을 일관성 있게 사용하는 것이 좋겠다.