정의 및 사용 방법
배열에서 toReversed() 함수는
주어진 배열의 요소 순서를 역순(reverse)으로 뒤집은 새로운 배열을 반환합니다.
특징
- 이 함수는 주어진 원본 배열을 직접 수정하지 않으며, 뒤집은 새로운 배열을 반환합니다.
- 원본 배열을 기준으로, 원본의 첫 번째 요소는 반환된 배열의 마지막이 되고, 마지막 요소는 첫 번째가 됩니다.
참고하세요!
배열에서 reverse() 함수는 주어진 배열의 요소 순서를 역순(reverse)으로 직접 뒤집습니다.
원본 배열을 직접 뒤집고, 뒤집은 원본 배열의 참조를 반환한다는 점에서, 새로운 배열을 생성하여 반환하는 toReversed() 함수와는 차이점이 있습니다.
기본 예제
const arr = [1, 2, 3, 4, 5];
const reversedArr = arr.toReversed();
/* 역순으로 뒤집은 새로운 배열을 반환합니다. */
console.log(reversedArr); // 출력: [5, 4, 3, 2, 1]
/* 원본 배열을 직접 수정하지 않습니다. */
console.log(arr); // 출력: [1, 2, 3, 4, 5] (원본 유지)
구문
arr.toReversed()
arr은 toReversed() 함수를 적용할 원본 배열입니다.
매개변수
없습니다.
반환 값
원본 배열의 요소를 역순으로 뒤집은 새로운 배열을 반환합니다. 주어진 원본 배열은 직접 수정하지 않습니다.
다양한 예제
toReversed() 함수는 여러 상황에서 다양하게 활용될 수 있습니다. 몇 가지 예제를 살펴보겠습니다.
순서 반전 후 반복
const numbers = [1, 2, 3, 4, 5];
// 배열 순서를 역순으로 변경하고 각 요소 출력
numbers.toReversed().forEach(number => {
console.log(number);
});
// 출력 순서: 5, 4, 3, 2, 1
코드 부연설명
forEach() 함수는 배열을 순회해서 각 요소를 콜백 함수로 처리하기 위한 함수입니다.
문자열을 뒤집기
const str = "Hello, World!";
// 문자열을 배열로 나누고, 역순으로 뒤집은 뒤, 다시 문자열로 합칩니다.
const reversedStr = str.split("").toReversed().join("");
console.log(reversedStr);
// 출력: "!dlroW ,olleH"
코드 부연설명
문자열의 split() 함수는 문자열을 주어진 문자열 구분자나 정규 표현식을 기준으로 나누어 배열로 변환합니다.
코드 부연설명
배열의 join() 함수는 배열의 각 요소를 지정된 구분자로 연결(join)하여 하나의 문자열로 반환합니다.
역순으로 필터링
const numbers = [1, 2, 3, 4, 5];
// 배열을 역순으로 변경하고 특정 조건을 만족하는 요소만 필터링
const filteredNumbers = numbers.toReversed().filter(number => number % 2 === 0);
console.log(filteredNumbers);
// 출력: [4, 2]
코드 부연설명
배열의 filter() 함수는 배열의 요소를 순회하면서 콜백 함수를 사용하여 원하는 조건에 따라 필터링하는 함수입니다. 필터링된 배열을 반환합니다.
고려할 점
toReversed() 함수는 원본 배열을 변경하지 않고, 주어진 배열의 요소 순서를 역순(reverse)으로 뒤집은 새로운 배열을 반환합니다.
따라서, 처리해야 할 배열의 크기가 매우 큰 경우에는 메모리 사용량이 증가할 수 있습니다. 특히 대량의 데이터를 다루는 루프 안에서 반복적으로 호출하면 성능에 영향을 줄 수 있습니다.
대용량 배열의 요소를 뒤집으려면 다음을 고려할 수 있습니다.
- 원본 배열을 그대로 유지해야 하는 경우에는
toReversed()함수를 사용합니다. - 원본 배열을 직접 뒤집어도 되는 경우에는
reverse()함수를 사용하는 것이 메모리 사용 측면에서 더 효율적일 수 있습니다.
호환성
| 메서드 |
데스크탑 Chrome
|
데스크탑데스크탑 Edge
|
데스크탑 Firefox
|
Safari
|
Node.js
|
|---|---|---|---|---|---|
toReversed()
|
110 | 110 | 125 | 16 | 20 |
명세서
| 명세서 사양 | |
|---|---|
toReversed()
|
ECMAScript® 2026 Language Specification #sec-array.prototype.toreversed |