널 병합 / 옵셔널 체이닝 [node.js 교과서]

본 게시글은 node.js 교과서 강의를 듣고 정리한글입니다

 

- ES2020 에서 추가된 ?? (널 병합) 연산자와 ?. (옵셔널 체이닝) 연산자이다.

- 널 병합 연산자는 주로 || 연산자 대용으로 사용되며 falsy 값 ( 9, '', false, NaN, null, undefined ) 중 null 과 undefined 만 따로 구분한다

 

널 병합 연산자 ??

const a = 0;

const b = a || 3; // || 연산자는 falsy 값이면 뒤로 넘어감

console.log(b); // 3 

const c = 0;

const b = c ?? 3; // ?? 연산자는 null과 undefined 일 때만 뒤로 넘어감

console.log(b); // 0

const e = null;

const f = e ?? 3;

console.log(f); // 3

const g = undefined;

const h = g ?? 3;

console.log(h); // 3

---

옵셔널 체이닝 연산자 ?.

cosnt a = {};

a.b; // a 가 객체이므로 문제없음

cosnt c = null;

try{
	c.d;
}catch(err){
     console.log(err); // TypeError: Cannot read properties of null (reading ‘d’)
}

c?.d; // 문제없음

try{
	c.f();
} catch(err) {
     console.log(err); // TypeError: Cannot read properties of null (reading ‘f’)
}

c?.f(); // 문제없음

try{
	c[0];
} catch(err) {
    console.log(err); //  TypeError: Cannot read properties of null (reading ‘0’)
}

c?.[0]; // 문제없음

- 옵셔널 체이닝 연산자는 null 이나 undefined 의 속성을 조회하는 경우 에러가 발생하는 것을 막는다.

- 위 코드처럼 일반적인 속성뿐 아니라 함수 호출이나 배열 요소 접근에 대해서도 에러가 발생하는 것을 방지할 수 있다.

- c?.d 와 c?.f() , c?.[0] 의 값은 undefined 가 된다.

- 에러의 빈도를 획기적으로 낮출 수 있기에 자주 사용된다.

 

추가로 널병합과 옵셔널 체이닝은 같이 쓰면 좋다.

const c = null;

c?.[0] ?? ‘123’;