toReversed(),toSorted(),toSpliced()

toReversed(),toSorted(),toSpliced()

ECMA2023에 새롭게 추가된 배열관련 메소드

■ toReversed()

반대로 뒤집은 새로운 배열을 반환

[toReversed - mdn 공식 문서]

toReversed()	reverse()
반대로 뒤집은 새로운 배열을 반환	기존 배열을 반대로 뒤집어 반환

// toReversed()
const items = [1, 2, 3];
console.log(items); // [1, 2, 3]

const reversedItems = items.toReversed();
console.log(reversedItems); // [3, 2, 1]
console.log(items); // [1, 2, 3]

// reverse()
const items = [1, 2, 3];
console.log(items); // [1, 2, 3]

const reversedItems = items.reverse();
console.log(reversedItems); // [3, 2, 1]
console.log(items); // [3, 2, 1]

■ toSorted()

정렬한 새로운 배열을 반환
[toSorted - mdn 공식 문서]

toSorted()	sort()
오름차순으로 정렬한 새로운 배열을 반환	기존 배열을 오름차순으로 정렬하여 반환

// toSorted()
const months = ["Mar", "Jan", "Feb", "Dec"];
const sortedMonths = months.toSorted();
console.log(sortedMonths); // ['Dec', 'Feb', 'Jan', 'Mar']
console.log(months); // ['Mar', 'Jan', 'Feb', 'Dec']

// sort
const months = ["Mar", "Jan", "Feb", "Dec"];
const sortedMonths = months.sort();
console.log(sortedMonths); // ['Dec', 'Feb', 'Jan', 'Mar']
console.log(months); // ['Dec', 'Feb', 'Jan', 'Mar']

■ toSpliced()

배열에서 주어진 인덱스를 제거 또는 교체한 새로운 배열을 반환
[toSpliced - mdn 공식 문서]

toSpliced(배열 변경할 시작 인덱스, 제거할 배열의 요소 수, 배열에 추가할 요소)

toSpliced()	splice()
배열에서 주어진 인덱스를 제거 또는 교체한 새로운 배열을 반환	기존 배열에서 주어진 인덱스를 제거 또는 교체하여 반환

// toSpliced()
const months = ["Jan", "Mar", "Apr", "May"];

// 인덱스 1에 "Feb" 추가 (제거 요소 0)
const months2 = months.toSpliced(1, 0, "Feb");
console.log(months2); // ["Jan", "Feb", "Mar", "Apr", "May"]

// 인덱스 2부터 2개의 요소 삭제
const months3 = months2.toSpliced(2, 2);
console.log(months3); // ["Jan", "Feb", "May"]

// 인덱스 1부터 1개의 요소 삭제하고, "Feb", "Mar"  추가
const months4 = months3.toSpliced(1, 1, "Feb", "Mar");
console.log(months4); // ["Jan", "Feb", "Mar", "May"]

// 원본의 배열은 변하지 않음!
console.log(months); // ["Jan", "Mar", "Apr", "May"]

// splice
const months = ["Jan", "March", "April", "June"];

// 인덱스 1에 "Feb" 추가 (제거 요소 0)
const months2 = months.splice(1, 0, "Feb");
console.log(months2); // []
console.log(months); // ['Jan', 'Feb', 'March', 'April', 'June']

// 인덱스 2부터 2개의 요소 삭제
const months3 = months.splice(2, 2);
console.log(months3); // [ 'March', 'April' ]
console.log(months); // [ 'Jan', 'Feb', 'June' ]

// 인덱스 1부터 1개의 요소 삭제하고, "Feb", "Mar"  추가
const months4 = months.splice(1, 1, "Feb", "Mar");
console.log(months4); // [ 'Feb' ]
console.log(months); // [ 'Jan', 'Feb', 'Mar', 'June' ]

// months2,months3,months4 → 제거된 요소들
console.log(months); // [ 'Jan', 'Feb', 'Mar', 'June' ]