ES2021 또는 ES12의 새로운 기능은 무엇입니까?

Modern JS with ES6+ 게시물에서 설명한 바와 같이 TC39는 ECMAScript 규범을 추진하고 이 규범을 자바스크립트 언어로 표준화하는 것을 담당하는 그룹이다.2015년 ES2015 또는 ES6이 출시된 이후 ECMAScript의 다음 버전은 매년 출시 주기가 있습니다.게시에 기능을 추가하려면 먼저 4개의 제안 단계를 거쳐야 게시 승인을 받을 수 있습니다.ES2021 또는 ES12에 추가된 기능에 대해 살펴보겠습니다.
너는 GitHub에서 여러 해 동안 완성된 모든 제안을 볼 수 있다.

밧줄.원형후보 선수

replaceAll(regExp, replacementString);

replaceAll(regExp, replacerFunction);

replaceAll(substr, replacementString)

replaceAll(substr, replacerFunction)

.replaceAll() 방법은 .replace() 방법과 매우 비슷하지만 후자는 첫 번째 실례만 바꾸고 전자는 정규 표현식이나 하위 문자열의 모든 실례를 대체한다.이 방법은 첫 번째 인자의 하위 문자열이나 정규 표현식을 받아들일 수 있고, 두 번째 인자에 대한 문자열의 교체 문자열이나 교체 함수를 되돌려줄 수 있다.주의해야 할 것은 replaceAll() 호출된 첫 번째 파라미터가 RegExp 대상이나 정규 표현식 문자이고 두 번째 파라미터가 함수라면 이 함수는 여러 번 호출될 것이다.예를 들어 Replacer Function이 어떤 파라미터를 전달했는지 더 많은 정보를 알고 싶으면 MDN docs를 보십시오.

const str = 'James lives in Central Florida. James has a dog named d00d.';

const strReplaced = str.replace( 'James', 'Kevin' ); // Kevin lives in Central Florida. James has a dog named d00d.

const strAllReplaced = str.replaceAll( 'James', 'Kevin' ); // Kevin lives in Central Florida. Kevin has a dog named d00d.

약속할게.어떤

Promise.any(iterable);

Promise.any() 방법은 Promise 대상의iterable를 유일한 매개 변수로 받아들이고 Promise 대상을 되돌려준다. 이 대상은 모든 전송Promise 대상이 해석될 때 해석되고 그 값은 해석된 원시Promise 대상이다.

const promise1 = new Promise( resolve => setTimeout( resolve, 100, 'first' ) );

const promise2 = new Promise( resolve => setTimeout( resolve, 300, 'second' ) );

const promise3 = new Promise( resolve => setTimeout( resolve, 700, 'third' ) );

Promise.any( [
 promise1,
 promise2,
 promise3,
] ).then( value => console.log( value ) );

겁쟁이

WeakRefs를 사용하면 스팸 컬렉션이 나중에 삭제되는 것을 막지 않고 객체에 대한 참조를 만들 수 있습니다.객체에 대한 참조는 JavaScript에서 엄격하게 유지되므로 객체에 대한 참조만 있으면 스팸이 수집되지 않습니다.WeakRefs는 인용을 만드는 방법으로 이 인용은 강제로 보유한 것이 아니라 쓰레기로 수집될 수 있다.
제안 자체에 따라 정확한 사용WeakRef과 FinalizationRegistry은 꼼꼼히 고려해야 한다avoided, if possible.언어 속 쓰레기 수집에 심각하게 의존하기 때문이다.요컨대 JavaScript는 스팸 컬렉터로서 더 이상 변수에 액세스할 수 없는 경우 스팸 컬렉터가 메모리에서 자동으로 제거됩니다.여기서 가장 어려운 부분은 쓰레기를 수집하는 시간과 방식은 완전히 자바스크립트 엔진 자체에 달려 있다는 것이다.서로 다른 엔진은 쓰레기 수집이 발생하는 시간이나 방식에 따라 다른 결과를 초래할 수 있다.
이 개념은 매우 간단하지만 용례가 매우 보기 드물고 구체적이며 고급스럽다. 왜냐하면 이것들은 모두 슈퍼 사용자 특성이기 때문에 대부분의 사용은 프레임워크나 라이브러리에서 이루어진다.
WeakRef는 새로운 WeakRef 구조 함수로 만들어졌으며, WeakRef 변수의 값은 deRef 방법으로 접근할 수 있습니다.

const wr = new WeakRef( {
 name: 'Kevin'
} );

console.log( wr.deref()?.name );

//output: Kevin

개발 도구의 성능 탭에서 Chrome의 스팸 컬렉터를 강제로 제거할 수 있습니다.

논리 대입 연산자

본 제안의 목적은 주로 논리 연산자(&&,|| 또는??와 부치 표현식을 결합시키는 것이다.

논리 또는 대입 연산자 ||| =

x ||= y;

논리 또는 부치 연산자||=는 논리나 연산자||와 마찬가지로 일종의 단거리 구치이다. 이것은 첫 번째 조작수가falsy일 때만 두 번째 조작수에 대해 값을 구한다는 것을 의미한다.위의 문법 표현식은 x || (x = y)와 같고 x = x || y가 아니라 후자는 항상 부치를 집행한다.이것은 y가falsy라면 x는x에만 분배되고 그렇지 않으면 x원시값을 보존한다는 것을 의미한다.

const updateVoteCount = user => {
  // We can do this.
  if ( ! user.votes ) {
    user.votes = 1
  }

  // Or this.
  user.votes = user.votes || 1;

  // Or use the new logical assignment operator.
  user.votes ||= 1
}

논리 및 할당 연산자 & & & =

x &&= y;

논리 AND 대입 연산자&&=도 일종의 단락 구값이다. 논리 AND 연산자&&와 같이 첫 번째 조작 수치가truthy일 때만 두 번째 조작 수치를 구한다는 뜻이다.위의 문법 표현식은 x && (x = y)와 같고 x = x && y가 아니라 후자는 항상 부치를 집행한다.이것은 ytruthy로 평가될 때만 x에 분배된다는 것을 의미한다. 그렇지 않으면 x원시falsy값을 보류한다.

let x = 1;
const y = 2;

x &&= y;

console.log( x ); // 2

논리 공백 값 연산자 =

x ??= y;

논리적 공수치 연산자x도 일종의 단거리 구값이다. 논리적 공수치 연산자??=와 같이 첫 번째 조작수 구값이 ?? 또는 null일 때만 두 번째 조작수에 대해 값을 구한다는 것을 의미한다.위의 문법 표현식은 undefined와 같고 x ?? (x = y )가 아니라 후자는 항상 부치를 집행한다.이는 x = x ?? y의 계산 결과가 y 또는 x일 경우 x는 null에만 분배되고 그렇지 않으면 undefined는 원래의 값을 보존한다는 것을 의미한다.

const getKey = () => 'test-key';

const user = { name: 'Kevin', age: 33 };

user.key ??= getKey();

console.log( user.key ); // 'test-key'

숫자 구분자

x는 백만 원, 10억 원입니까, 아니면 둘 사이에 있습니까?새 숫자 구분자를 사용하면 숫자를 1000000000로 구분할 수 있어 숫자와 정수의 실제 값을 쉽게 정할 수 있습니다.

let num = 1_000_000_000; /// 1 billion.

num = 1_000_000; // 1 millon.

num = 100_000_000; // 100 millon.