[2021.06.13] Javascript ECMA 2021 소개

https://javascript.plainenglish.io/es12-is-going-to-make-your-life-easier-6be8d131e117

 

 

replaceAll

기존에는 문자열 내에 특정 문자를 변경하기 위해, String.replace를 이용했었는데, 이것은 문자열 중 가장 앞에 있는 한 자리만 변경해주므로, 모든 문자열을 대상으로 하려면, 'RegExp' 정규식을 통해 처리를 해주었어야 했다.
그러나 이번에 replaceAll() 함수가 추가되면서, 따로 정규식을 통해 처리하지 않아도 되게 되었다. 🙌

 

'FooBarFoo'.replaceAll('F', 'C'); // 'CooBarCoo'

 

 

assignment operators

1. ??=

기존에는, 해당 변수가 null 혹은 undefined일 시, 특정 값으로 세팅을 해주기 위해서는 아래와 같이 if문으로 세팅을 해주었었다.

if(sense === null || sense === undefined){
  sense = 'Learn Programming';
}

 

그러나 아래와 같은 operator를 이용하면, if문을 쓰지 않고도 해결할 수 있다.

sense ??= 'Learn Programming';

 

그런데 생각해보니, 기존에도 그냥 아래처럼 해결할 수도 있을 것 같다.

sense = sense ?? 'Learn Programming';

(그래도 위 구분이 더 짧긴 하다.)

 

 

2. ||=

위의 operator는 변수에 선언된 값이 없을 시 이용하는 것이라면, 이것은 변수의 값이 falsy한 값일 때 이용할 수 있다.

if(!sense) {
  sense = "Learn Programming";
}

기존의 이 코드를, 아래처럼 변경할 수 있다.

sense ||= 'Learn Programming';

 

 

3. &&=

요건, 바로 위에꺼랑 반대로, 값이 할당 되어있을 때 다른 값으로 세팅한다.

let person = "Know Programming";

if(person){
  person = "Sensible";
}

기존에 이렇게 되어있던 코드를, 아래처럼 변경할 수 있다.

let person = "Knows Programming";

person && = 'Sensible';

 

 

Promise.any()

기존의 Promise Object 여러개를 동시에 수행하는 Promise.All(), Promise.race()가 있었다.

Promise.All()은 여러개의 promise를 동시에 호출해서, 모두 수행이 끝난 뒤, 결과에 대한 반환값을 array로 반환하는 형태이다.
Promise.race()는 여러개의 promise를 동시에 호출해서, 그 중 가장 빠르게 처리된 promise의 결과 값을 반환하는 형태이다.

이번에 새로 추가된 Promise.any() 역시 Promise.race()와 비슷하게, 여러개의 Promise 중 가장 빨리 수행된 Promise의 결과 값만 반환을 한다. 

 

그러나 Promise.race와의 차이는 아래와 같다.

Promise.race는 수행에 대한 resolve, reject 상관 없이 무조건 빨리 처리된 promise를 반환한고, Promise.any()는 정상적으로 resolve 된 녀석 중 가장 빠른 녀석을 반환한다.

 

var firstPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Data for Promise One")
    }, 3500)
});

var secondPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Data for Promise Two")
    }, 800)
});

var thirdPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        reject("Data for Promise Three")
    }, 300)
});

var forthPromise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Data for Promise Four")
    }, 1000)
});


Promise.any([firstPromise, secondPromise, thirdPromise, forthPromise]).then((firstResolvedData) => {
  console.log(`Data Received: ${firstResolvedData}`)
});

 

위 코드에서는 가장 빨리 수행되는 Promise는 세 번째 이지만, 반환되는 Promise는 두 번째이다.