원본이 보존되는 배열 메서드 사용하기

원본이 보존되지 않는 배열 메서드를 대체하는 새로운 메서드에 대해 알아본다.

배열 메서드 중에는 원본 배열이 보존되지 않는 것이 몇 가지 있다.

• push
• pop
• unshift
• shift
• splice
• sort
• reverse

이 메서드들은 원본이 변형된다.

const array = [1, 2, 3, 4, 5];

const reversedArray = array.reverse();

console.log(reversedArray); // [5, 4, 3, 2, 1]
console.log(array); // [5, 4, 3, 2, 1]

원본이 변형된다는 것을 잊고 해당 메서드를 사용하다 보면 오류나 버그의 원인이 될 수 있다. 또한 불변성이 중요한 함수형 프로그래밍에서는 어떤 것을 변형시키는 행동은 좋지 않다.

이러한 이유 때문인지 원본이 변형되지 않는 불변 메서드들이 ES2023에서 추가되었다.

새로운 메서드의 이름은 기존 이름의 과거 분사형 앞에 to를 붙인 이름이다. 사용법은 기존과 동일하다.

이제 불변 메서드를 사용하면 원본 배열이 변형되는 것을 걱정할 필요가 없어진다.

const array = [1, 2, 3, 4, 5];

const reversedArray = array.toReversed();

console.log(reversedArray); // [5, 4, 3, 2, 1]
console.log(array); // [1, 2, 3, 4, 5]

앞으로는 splice, sort, reverse 대신 toSpliced, toSorted, toReversed를 사용하자.