ECMAScript 2025: What's new?

JavaScriptECMAScriptES2025프론트엔드

참고: Ecma International approves ECMAScript 2025: What’s new?

ECMAScript 2025 에서 추가된 사항들

  1. Import Attributes 및 JSON 모듈 공식 지원
  2. 반복자(iterator) 헬퍼 메소드
  3. Set 메소드
  4. 정규표현식 (RegExp) 기능 강화
  5. Promise.try() 도입

1. Import Attributes 및 JSON 모듈 공식 지원

// Static import
import configData1 from './config-data.json' with { type: 'json' };

// Dynamic import
const configData2 = await import(
  './config-data.json', { with: { type: 'json' } }
);
  • with 키워드로 가져오는 리소스의 타입, 처리 방식 등을 명시 가능.

2. 반복자(iterator) 헬퍼 메소드

반복자(iterator)에서도 map, filter, take, drop 등 배열 메서드 같은 체이닝이 가능해짐.

const result = someIterator
  .map(x => x * 2)
  .filter(x => x > 10)
  .take(5)
  .toArray();

신규 추가된 반복자 메소드:

  • take(n): 처음 n개 요소 가져오기
  • drop(n): 처음 n개 요소 건너뛰기
  • toArray(): 결과를 배열로 수집

Array가 아니라도 Set이나 Map 등 iterable에서 직접 체인 처리 가능.
전체 데이터를 중간 단계 없이 순차적으로 처리해 메모리·성능 효율 개선.


3. Set 메소드 기능 추가

Set 객체에 수학적 집합 연산이 가능하도록 여러 메서드가 추가됐다.

const a = new Set([1, 2, 3]);
const b = new Set([2, 3, 4]);

a.union(b);              // => Set {1, 2, 3, 4}
a.intersection(b);       // => Set {2, 3}
a.difference(b);         // => Set {1}
a.symmetricDifference(b); // => Set {1, 4}
a.isSubsetOf(b);         // => false
a.isSupersetOf(b);       // => false
  • union(otherSet): 합집합
  • intersection(otherSet): 교집합
  • difference(otherSet): 차집합
  • symmetricDifference(otherSet): 대칭 차집합
  • isSubsetOf(otherSet): 부분집합 여부 확인
  • isSupersetOf(otherSet): 상위집합 여부 확인

4. 정규표현식(RegExp) 기능 강화

RegExp.escape()

문자열을 자동으로 정규표현식에서 안전하게 사용할 수 있도록 이스케이프 처리.
특수문자(. * + ? | ( ) [ ] { } ^ $ \)가 정규식 패턴에서 의미를 잃고 문자 그대로 매칭되도록 처리한다.

const keyword = 'hello.';
const text = 'foo hello.world bar helloXworld';

// before
function escapeRegExp(string) {
  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
}
const safeKeyword = escapeRegExp(keyword);
const regex = new RegExp(safeKeyword, 'g');
console.log(text.match(regex)); // ['hello.world']

// after
const safeKeyword = RegExp.escape(keyword);
const regex = new RegExp(safeKeyword, 'g');
console.log(text.match(regex)); // ['hello.world']

인라인 플래그 지원

정규표현식 내부 특정 부분에만 플래그(i, m, s 등)를 적용 가능.

const re = /^x(?i:HELLO)x$/;  // (?flags:패턴)

// 대소문자 섞여도 HELLO 부분만 case-insensitive!
console.log(re.test('xHELLOx')); // true
console.log(re.test('xhellox')); // true
console.log(re.test('xHeLLoX')); // true
console.log(re.test('xHELLox')); // true

console.log(re.test('XHELLOX')); // false (양 끝 x는 여전히 대소문자 구분)

중복 이름 캡처 그룹

분기 패턴(branch) 내에서 동일한 캡처 그룹 이름 사용 가능.

const re = /(?<chars>a+)|(?<chars>b+)/v;

const matchA = re.exec('aaa');
const matchB = re.exec('bbb');

console.log(matchA.groups.chars); // ['aaa', undefined]
console.log(matchB.groups.chars); // [undefined, 'bbb']

5. Promise.try() 도입

Promise.try()는 주어진 콜백 함수를 즉시 실행하고, 그 반환값을 Promise로 래핑하여 반환.
동기 코드도 Promise로 감싸서 일관된 에러 처리가 가능하도록 함.

Promise.try(() => {
  return mayThrowError(); // 동기 or 비동기 가능
}).catch(error => {
  console.error('에러 발생:', error);
});