2025년에 자바스크립트 개발자라면 꼭 알아야 할 기능들

• 자바스크립트는 2025년에도 계속 진화 중이며, 일부 기능은 잘 알려지지 않았지만 매우 유용함
• 새로운 Iterator 헬퍼 메서드들은 대규모 데이터 변환 시 훨씬 더 메모리 효율적으로 동작
• 배열 끝에서 접근 가능한 at(), 간단한 Promise.withResolvers() 사용, 깊은 복사용 structuredClone() 등
• Set에 대한 집합 연산과 템플릿 문자열 태깅 함수, WeakMap/WeakSet 사용법은 여전히 많은 개발자가 간과하고 있음

Iterator Helper 메서드

• 기존의 arr.filter().map()처럼 체이닝하면 각 단계마다 새로운 배열이 생성되어 비효율적
• arr.values().drop(10).take(10).map(...).toArray()처럼 이터레이터 기반 체이닝으로 개선 가능
• 주요 메서드:
  • drop(): 처음 n개 생략
  • take(): 처음 n개만 취함
  • filter(), map(), flatMap(): 배열 메서드와 유사하게 동작
  • reduce(), some(), every(), find(): 조건 테스트 및 누적 계산 지원
  • toArray(): 최종 배열로 변환
• Safari는 2025년 3월 31일부터 지원 시작, 아직은 모든 브라우저가 지원하지 않음

Array at()

• arr.at(n)은 arr[n]과 유사하나, 음수 인덱싱으로 뒤에서부터 접근 가능
• 예: [10, 20, 30].at(-1) → 30
• arr[arr.length - 1]과 같은 불편한 방식 없이 마지막 요소 접근 가능

Promise.withResolvers()

• 기존 방식: new Promise((resolve, reject) => { ... })에서 바깥에서 resolve/reject 저장
• 이제는: const { promise, resolve, reject } = Promise.withResolvers()로 간결하고 직관적으로 사용 가능

String.replace() 콜백 활용

• replace()와 replaceAll()의 두 번째 인자는 문자열뿐만 아니라 콜백 함수도 허용
• 예: "X, X, X".replaceAll("X", (match, i) => match + i) → "X0, X1, X2"
• 한 번에 다양한 치환 가능 → 퍼포먼스 및 메모리 측면에서 효율적

변수 교환 (Swap)

• 기존 방식: temp 변수 사용
• 간결한 방식: [a, b] = [b, a]로 배열 디스트럭처링으로 변수 교환

structuredClone()

• JSON.stringify() + JSON.parse() 대신 보다 정확하고 효율적인 깊은 복사 지원
• 장점:
  • NaN, undefined, bigint 등도 지원
  • 순환 참조도 안전하게 복사
  • 큰 객체에 대해 메모리와 속도 효율성 높음

Tagged Template Literals

• 템플릿 문자열을 특정 함수로 파싱 가능
• HTML 이스케이프 처리 등의 동적 문자열 후처리에 유용
• 예:
  escapeHtml 태그 함수로 <br> ${'<br>'} → <br> &lt;br&gt;

WeakMap / WeakSet

• 일반 Map, Set과 유사하지만:
  • 키는 객체만 허용 (원시 값 X)
  • GC 대상이 되면 자동으로 제거됨
• 순환 참조 가능성이 있거나 부작용 없이 객체 메타데이터 저장할 때 적합

Set 집합 연산 지원

자바스크립트에서 Set 객체에 대해 다양한 논리 연산이 새로 추가됨:

• difference(): 차집합 (A - B)
• intersection(): 교집합 (A ∩ B)
• union(): 합집합 (A ∪ B)
• symmetricDifference(): 대칭차집합 (A △ B)
• isDisjointFrom(): 겹치는 요소 없음 여부
• isSubsetOf(): 부분집합 여부
• isSupersetOf(): 전체집합 여부