Published on

Change Array by Copy (JS)

Authors
  • avatar
    Name
    Luffy Yeon
    Twitter

Change Array by Copy

| 해당 내용은 개인적인 공부를 위한 글로 오역 및 개인적인 의견이 반영된 내용이 있을 수 있으니 참고하여 주시기 바라며 문제가 되는 내용이 있는 경우 메일로 피드백 부탁합니다.

ts39 proposal에서 Stage 3 내용 중에 Change Array by Copy라는 제안을 보고 표준에 포함되고 나면 많이 사용하게 될 것 같은 내용이라 정리를 해봐야겠다고 생각했다. 단순히 Change Array by Copy README.md를 번역하는 내용이니 정확한 내용은 원문 제안서를 확인하길 바란다.


Array.prototypeTypedArray.prototype에 대한 추가 메소드를 제공하여 변경 사항이 적용된 복사된 새로운 배열을 반환 받을 수 있게 한다.



Status

해당 제안은 현재(2022.05.04) Stage 3이다.



Overview

이 제안은 Array.prototype에 아래와 같은 함수 속성을 도입한다.

  • Array.prototype.toReversed() -> Array
  • Array.prototype.toSorted(compareFn) -> Array
  • Array.prototype.toSpliced(start, deleteCount, ...items) -> Array
  • Array.prototype.with(index, value) -> Array

위의 모든 메서드는 대상 배열을 유지하고 변경 사항이 반영된 복사본 배열을 반환한다.


해당사항은 TypedArray에도 추가된다.

  • TypedArray.prototype.toReversed() -> TypedArray
  • TypedArray.prototype.toSorted(compareFn) -> TypedArray
  • TypedArray.prototype.toSpliced(start, deleteCount, ...items) -> TypedArray
  • TypedArray.prototype.with(index, value) -> TypedArray

해당 메소드는 TypedArray의 하위 클래스에서도 사용할 수 있다.

  • Int8Array
  • Uint8Array
  • Uint8ClampedArray
  • Int16Array
  • Uint16Array
  • Int32Array
  • Uint32Array
  • Float32Array
  • Float64Array
  • BigInt64Array
  • BigUint64Array


Example

const sequence = [1, 2, 3]
sequence.toReversed() // => [3, 2, 1]
sequence // => [1, 2, 3]
const outOfOrder = new Uint8Array([3, 1, 2])
outOfOrder.toSorted() // => Uint8Array [1, 2, 3]
outOfOrder // => Uint8Array [3, 1, 2]
const correctionNeeded = [1, 1, 3]
correctionNeeded.with(1, 2) // => [1, 2, 3]
correctionNeeded // => [1, 1, 3]


Motivation

Tuple.prototypeRecord & Tuple에서 Tuple의 불변적인 특성을 처리하는 방법으로 고정 배열을 다루는 사용자에게 유용할 수 있다.




Implementations

| core-js:

| es-shims:

| ./polyfill.js (minimalist reference implementation)



In Conclusion

정말 오랜만에 tc39/proposals를 확인해봤다. 정말 엄청나게 많은 라이브러리도 만들어지고 있지만 Javascript도 계속해서 업그레이드되는 것에 관심을 지속해서 갖고 놓치지 않아야겠다. 이미 표준으로 추가되었지만 놓치고 있는 부분들도 많을 것으로 생각되지만 차근차근 다시 쫓아야겠다.



[Ref]: