자바스크립트 배열 순서 뒤집기: reverse() 메서드 완벽 가이드

자바스크립트에서 배열의 요소 순서를 반대로 뒤집고 싶다면 reverse() 메서드를 사용하면 됩니다. 이 메서드는 배열의 첫 번째 요소를 마지막으로, 마지막 요소를 첫 번째로 이동시켜 전체 순서를 역순으로 변경합니다.

reverse() 메서드의 특징

reverse()는 원본 배열 자체를 직접 수정하는(mutating) 메서드라는 점에 유의해야 합니다. 즉, 호출된 배열의 순서가 실제로 변경되며, 반환값은 순서가 뒤집힌 그 배열입니다. 원본을 유지하고 싶다면 먼저 slice()나 스프레드 연산자([...arr])로 복사한 뒤 reverse()를 적용하는 것이 좋습니다.

기본 사용 예제

아래 코드를 실행하면 배열의 순서가 뒤집히는 것을 확인할 수 있습니다.

<html>
   <head>
      <title>JavaScript Array reverse Method</title>
   </head>
   <body>
      <script>
         var arr = [10, 20, 30, 40];
         var reversed = arr.reverse();
         document.write("Reversed array is : " + reversed);
         // 출력 결과: Reversed array is : 40,30,20,10
      </script>
   </body>
</html>

원본 배열을 유지하면서 순서 뒤집기

원본 배열을 변경하지 않으려면 다음과 같이 복사본을 만들어 사용할 수 있습니다.

var original = [1, 2, 3, 4];
var copy = original.slice().reverse(); // 원본 유지
// 또는 ES2023부터 지원되는 toReversed() 사용
var reversedCopy = original.toReversed();

정리

reverse(): 배열을 제자리에서 뒤집으며 원본을 변경함
toReversed(): ES2023에서 도입된 메서드로, 원본을 변경하지 않고 새 배열 반환

간단하게 순서를 뒤집을 때는 reverse(), 불변성(immutability)을 지켜야 하는 상황이라면 toReversed() 또는 복사 후 reverse() 방식을 활용하세요.