[JavaScript Core] 논리 연산자(||, &&, !) 와 nullish 병합 연산자(??) 에 대해서 알아보자

 

이번에는 논리 연산자와  nullish 병합 연산자에 대해서 알아보도록 하겠습니다.

 

논리 연산자의 기본적인 부분은 아마 많은 분들이 아시고 계실거라 생각하지만, 기본적인 부분 뿐만 아니라 응용하여 다른 용도로 활용할 수 있는 방법과, 추가로 nullish 병합 연산자까지 다루어볼 것이니 끝까지 필독해주시면 감사하겠습니다! 

 

 

1. 논리 연산자

 

자바스크립트에는 세 종류의 논리 연산자가 존재합니다. 바로 ||(OR), &&(AND), !(NOT) 이죠.

 

그리고, 자바스크립트나 다른 프로그래밍 언어에 견해가 조금이라도 있으신 분들은 대부분 위의 세가지 연산자가 어떤 역할을 하는지 알겁니다. 꼭 프로그래밍 언어를 배우지 않았어도 상식적으로도 알 수 있죠.

 

true || false // true
true || true // true
false || false // false

 

먼저, OR 연산자는 비교할 항목 중, 하나라도 true가 존재하면 true를 결과로 가집니다. 

 

true && false // false
false && false // false
true && true // true

 

AND 연산자는 비교할 항목 모두가 true여야지만 true를 결과로 갖죠.

 

!true // false
!false // true

 

NOT 연산자는 해당 항목의 반대 boolean을 결과로 갖습니다.

 

 

여기까지가 기본적으로 대부분의 분들이 상식적으로 알고 있는 내용입니다.

 

위의 세 연산자는 모두 boolean(true, false) 만을 비교하여 결과를 도출했다는 공통점을 가지고 있죠. 따라서, 이제는 boolean 말고도 다른 타입을 이용해서 논리 연산자를 사용해보도록 하겠습니다.

 

0 || 1 // 1
null || 1 // 1
undefined || 1 // 1
null || undefined || 1 // 1
null || undefined || 0 // 0

 

OR 연산자를 이용해 boolean 값이 아닌 다른 타입의 값들을 비교한 결과입니다.

 

어떤식으로 연산을 수행하는지 설명하면,

 

1. 왼쪽부터 오른쪽으로 항목들을 하나하나씩 boolean으로 변환합니다.
2. 변환된 값이 true라면, 연산을 멈추고 그 항목의 본래 값을 결과로 갖습니다.
3. 만약, 모든 변환된 모든 항목이 false라면, 마지막 값을 반환합니다. 

 

따라서 위와 같은 결과를 갖게되는 것입니다. 실제 개발자 콘솔창에서 예제를 입력해보면서 실습해보시길 바랍니다.

 

null && 1 // null
1 && 0 // 0
1 && null && undefined // null
null && undefined && 0 // 0

 

AND 연산자는 OR 연산자와 반대의 과정으로 연산을 수행한다고 이해하시면 됩니다.

 

1. 왼쪽부터 오른쪽으로 항목들을 하나하나씩 boolean으로 변환합니다.
2. 변환된 값이 false라면, 연산을 멈추고 그 항목의 본래 값을 결과로 갖습니다.
3. 만약, 모든 변환된 모든 항목이 true라면, 마지막 값을 반환합니다.

 

마찬가지로 AND 연산자도 예제를 직접 입력하면서 실습해보시길 바랍니다.

 

 

2. nullish 병합 연산자

 

nullish 병합 연산자(??) 는 최근에 추가된 최신(?) 연산자입니다.

 

null ?? 1 // 1
null ?? 0 // 0
undefined ?? null ?? 1 // 1
undefined ?? null ?? 0 // 0

 

잠깐 보면 OR 연산자와 기능이 비슷해보이기도 하지만, nullish 병합 연산자는 확실한 값만 배제합니다.

 

바로, null과 undefined 입니다.

 

null, undefined 외의 다른 값이 나올때까지 왼쪽에서 오른쪽으로 항목을 하나하나씩 검사하면서, 다른 값이 나오면 그 값을 결과로 가집니다. 앞서 논리연산자를 이해하고 보니 간단하죠?

 

 

이렇게 논리 연산자와 병합 연산자를 알아보았는데, 코드를 줄이고 가독성을 높이는데 도움을 주는 구문들이니, 잘 사용하셔서 코드 수준을 더욱 올리셨으면 좋겠습니다.