// 1. 페이지의 에서 최대한 위에 이 코드를 붙여넣으세요. // 아래의 메타 태그를 복사해 사이트 홈페이지의 섹션에 붙여 넣어주세요. //2. 여는 태그 바로 뒤에 코드를 붙여넣으세요.

새소식

반응형
Javascript/문법

(ES2021) 자바스크립트 문법

  • -
반응형

Optional Chaining (선택적 체이닝)

Optional Chaining은 객체의 속성을 안전하게 접근하는 방법입니다. 만약 객체 내부의 속성 중 하나가 null 또는 undefined라면, 코드가 실행되는 도중 에러가 발생하는 것을 방지할 수 있습니다. 다음과 같이 사용할 수 있습니다.

 

참고 url

https://intelloper.tistory.com/22

const name = person?.name;
const age = person?.age?.years;

 

 

Nullish Coalescing (널 병합 연산자)

Nullish Coalescing은 변수가 null 또는 undefined일 때, 대체 값을 지정할 수 있는 방법입니다. 이전에는 || 연산자를 사용하여 처리했지만, 이는 falsy한 값 (0, '', false 등)도 대체 값으로 처리하는 문제점이 있었습니다. Nullish Coalescing은 이러한 문제를 해결했습니다. 다음과 같이 사용할 수 있습니다.

 

참고 url

https://intelloper.tistory.com/24

const myVariable = myVariableFromSomewhere ?? 'default value';

 

반응형

Promise.allSettled

Promise.allSettled는 Promise.all과 유사하지만, 모든 Promise가 처리되었을 때, 각 Promise의 결과에 상관없이 Promise 객체를 반환합니다. 이는 모든 Promise의 결과를 필요로 하는 상황이 아니라, Promise 중 일부가 실패해도 처리할 수 있는 상황에서 유용합니다. 다음과 같이 사용할 수 있습니다.

Promise.allSettled([promise1, promise2])
  .then(results => {
    results.forEach(result => {
      console.log(result.status, result.value);
    });
  });

 

 

Private Class Fields

Private Class Fields는 클래스 내부에서만 접근 가능한 private 변수를 생성하는 방법입니다. 이전에는 변수 앞에 '_'를 붙이는 방법으로 private 변수를 만들었지만, 이 방법은 실제로는 private이 아니었습니다. Private Class Fields는 다음과 같이 사용할 수 있습니다.

class Person {
  #name;

  constructor(name) {
    this.#name = name;
  }

  getName() {
    return this.#name;
  }
}

 

 

Logical Assignment (논리 할당)

Logical Assignment은 변수에 값을 할당하면서, 조건식을 함께 사용할 수 있는 방법입니다. 다음과 같이 사용할 수 있습니다.

let x = 0;
x ||= 1; // x = 1
x &&= 2; // x = 2

 

2021년 기준 버전의 자바스크립트 문법을 소개해드린 것이니 참고하시기 바랍니다.

 
반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.