단축평가 ( 논리연산자, 옵셔널체이닝연산자, null 병합 연산자 )

단축평가란?
단축평가는 표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평가 과정을 생략하는 것을 말한다.

먼저 앞에 연산자 파트에서 다뤘던,

1. 논리 연산자를 사용한 단축평가

|| ( 논리합 ) , && ( 논리곱 )

• | | ( 논리합 연산자 ): 뒤에꺼까지 true 일 수 있으니 읽는다. ( 하나라도 )
• && ( 논리곱 연산자 ): 앞의 것이 true 면 다음꺼까지 읽는다. ( 둘다 )

'cat' || 'dog' // cat
false || 'dog' // dog
'cat' || false // cat

'cat' && 'dog' // dog
false && 'dog' // false
'cat' && false // false

2. 옵셔널 체이닝 연산자

ES11 ( ECMAScript2020 ) 에서 도입--> 최신에 도입된 옵셔널 체이닝 연산자 ?. 는 좌항의 피연산자가 null 또는 undefined 인 경우 undefined를 반환하고, 그렇지 않으면 우항의 프로퍼티 참조를 이어간다.

a ?. b의 평가 결과는 다음과 같다.

• a가 null 또는 undefined면 undefined
• 그 외의 경우는 b

왜 사용하는걸까?

개발하다가 object의 property값이 없어서 에러가 발생하는 경우가 많이 있다.
객체는 property로 이루어져서 property key 값으로 접근하는데 ' ?. ' 형태를 가진 옵셔널 체이닝은 객체에 key(속성)이 존재하지 않아도 에러를 발생시키지 않고 접근할 수 있다.
따라서 데이터가 존재하는지 알기 힘들 때 사용할 수 있는 방법이다.

var obj = undefined;
console.log(obj.data); // error

var obj = undefined;
console.log(obj?.data);  
// obj 가 null 또는 undefined 경우, undefined를 반환하고 그렇지 않으면 우항

var obj = {data : 'test'}
console.log(obj?.data); 
// test 
            
            

3. null 병합 연산자

ES11 ( ECMAScript2020 ) 에서 도입--> 최신에 도입된 null 병합 연산자 ?? 는 좌항의 피연산자가 null 또는 undefined 인경우 우항의 피연산자를 반환하고, 그렇지않으면 좌항의 피연산자를 반환한다.
실무에서 많이 사용

a ?? b의 평가 결과는 다음과 같다.

• a가 null 또는 undefined면 b
• 그 외의 경우는 a

var foo = null ?? 'cat'
console.log(foo);
// cat

var foo = ''dog ?? 'cat'
console.log(foo);
// dog