ZeroCho Blog

2021년에도 어김없이 자바스크립트 신규 스펙이 나왔습니다. 이제는 별로 특별한 게 나오지는 않습니다. 추가된 몇 가지 기능들을 살펴 보시죠.

replaceAll

문자열을 한 번에 여러 개 바꿀 수 있는 편의 기능이 추가되었습니다.

'hello,zerocho,why'.replaceAll(',', ' ') // 'hello zerocho why'

이전에는 정규표현식을 사용해서 다음과 같이 했어야 합니다.

'hello,zerocho,why'.replace(/,/g, ' ') // 'hello zerocho why'

Promise.any

여러 개의 프로미스 중에 하나라도 성공하면 바로 resolve되고, 모든 프로미스가 다 실패하면 reject됩니다. reject 시에는 AggregationError가 발생합니다.

Promise.any([
  Promise.reject(1),
  Promise.reject(3),
  Promise.resolve(5), // 이게 가장 먼저 성공
]).then((result) => console.log(result === 5));

Promise.any([
  Promise.reject(1),
  Promise.reject(3),
  Promise.reject(5),
]).catch((result) => console.log(result)); // AggregationError 

Promise.race와 헷갈려하시는 분이 많을 것 같은데, Promise.race는 성공하든 실패하든, 가장 먼저 끝나는 것이 resolve되고, Promise.any는 먼저 성공(반드시 성공해야 함)하는 것이 resolve됩니다.

Promise.race([
  Promise.reject(1), // 이게 가장 먼저 끝남
  Promise.reject(3),
  Promise.resolve(5),
]).catch((result) => console.log(result === 1));

WeakReferences

WeakRef는 솔직히 한 번도 써본 적이 없습니다. 다만 공식 문서를 읽었을 때는 참조 관계는 유지하되 가비지컬렉션은 될 수 있는 객체에 적용하는 것으로 보입니다.

이 부분은 직접 공식 문서 를 읽어보세요.

Logical Assignment

||=, &&=, ??= 연산자가 추가되었습니다. 대충 무슨 역할인지는 아시겠죠?

a = a || 2;

코드가

a ||= 2;

로 줄어든 것입니다. 저는 애초에 위 코드를 잘 쓰지 않아서 느낌이 없지만, 쓰던 분들한테는 유용할 수 있겠네요.

?? 연산자는 nullish coalescing 연산자이니까 이게 뭔지 모르시는 분은 ES2020 글 을 읽고 오세요.

numeric separators

자바스크립트에서 큰 숫자를 표시할 때는 눈을 크게 뜨고 봐야 했습니다. 은행처럼 천 단위로 콤마를 안 붙여주기 때문인데요. 콤마는 못 붙이지만 숫자 단위를 구분할 수 있는 _ 기호가 추가되었습니다. 여러분이 구분하고 싶은 곳에다 추가하시면 됩니다. 소수점 아래에도 추가 가능합니다.

1_000_000
1_2345_2345
25.12_2364

한국 사람들은 천 또는 만 단위로 넣어두면 편하겠네요!