Array find from last

Array와 TypedArray 프로토타입에 findLast() 메서드와 findLastIndex() 메서드가 추가된다. 이름에서도 알 수 있듯이 두 메서드는 각각 find(), findIndex() 와 같은 일을 하지만 역순으로 결과를 계산한다.

const arr = [5, 12, 50, 130, 44];

const result = [...arr].reverse().find((element) => element > 45);

console.log(result);
// Expected output: 130

기존에는 특정 요소를 배열의 끝에서부터 찾고자 할 때 해당 배열을 역순으로 정렬한 뒤 find() 메서드를 이용해 찾아야 했다.
하지만 이러한 방식은 원본 배열을 변경하는 과정이 들어가게되기 때문에 사이드 이펙트가 발생할 여지가 있으며 정렬 과정에서 오버헤드가 발생할 수 있다.

Array.prototype.findLast()

findLast() 메서드는 배열을 역순으로 반복하면서 testing function을 만족하는 첫 번째 값을 반환한다. 만약 찾고자 하는 값이 없으면 undefined를 반환한다.

const arr = [5, 12, 50, 130, 44];

const result = arr.findLast((element) => element > 45);

console.log(result);
// Expected output: 130

Array.prototype.findLastIndex()

findLastIndex() 메서드는 배열을 역순으로 반복하면서 testing function을 만족하는 첫 번째 값의 인덱스를 반환한다. 만약 찾고자 하는 값이 없으면 -1을 반환한다.

const arr = [5, 12, 50, 130, 44];

const result = arr.findLastIndex((element) => element > 45);

console.log(result);
// Expected output: 3

Symbols as WeakMap keys

자바스크립트에서 Objects와 Symbols는 고유한 값임을 보장하고 다시 만들 수 없기 때문에 WeakMap의 키로 사용하기 적합하다. 이전 버전에서는 오직 Objects만이 WeakMap의 키가 될 수 있었지만 Symbols도 사용할 수 있게 되었다.

따라서 WeakMap의 키는 반드시 객체 또는 전역 심볼 레지스트리에 등록되지 않은 심볼이어야 한다.

const wm = new WeakMap();
const key = Symbol('key') // 다른 곳에서 등록되지 않아야 함!

wm.set(key, 'hi!');

console.log(wm.get(key));
// hi!

Change Array by Copy

기존 Array.prototype의 reverse(), sort(), splice() 메서드들은 원본 배열을 변형시켰다.

const arr = [5, 12, 50, 130, 44];

console.log([...arr].reverse()); // [ 44, 130, 50, 12, 5 ]
console.log(arr); // [ 5, 12, 50, 130, 44 ]

console.log(arr.reverse()); // [ 44, 130, 50, 12, 5 ]
console.log(arr); // [ 44, 130, 50, 12, 5 ]

따라서 원본 배열의 변형 없이 해당 메서드를 사용하기 위해서 원본 배열을 복사하는 과정이 필요했다.

ES2023부터는 해당 메서드들의 기능을 사용하면서도 원본 배열의 변형 없이 새로 복사된 배열을 반환하는 toReversed(), toSorted(), toSpliced() 메서드가 추가된다.

const arr = [5, 12, 50, 130, 44];

console.log(arr.toReversed()); // [ 44, 130, 50, 12, 5 ]
console.log(arr); // [5, 12, 50, 130, 44]

비슷하게 원본 배열의 변형 없이 새로 복사된 배열을 반환하는 with() 메서드도 추가되는데 with() 메서드는 첫번째 인자로 인덱스를, 두번째 인덱스로 값을 받아 해당 인덱스의 값이 새로운 값으로 바뀐 배열을 반환한다.

const arr = [5, 12, 50, 130, 44];

console.log(arr.with(1, 100)); // [5, 100, 50, 130, 44]
console.log(arr); // [5, 12, 50, 130, 44]

출처

What's new in ECMAScript 2023
MDN > Array.prototype.findLast()
MDN > Array.prototype.findLastIndex()
MDN > WeakMap
MDN > Array.prototype.with()