47일차 - 내가 몰랐던 or, and 연산자와 ??연산자의 기능

김민찬·2021년 6월 25일
0

취업으로의 여정

목록 보기
48/196

오늘의 코스 주 주제는 어제의 블로그 내용의 실습이였어서, 오늘은 자습 내용 블로깅 하겠다.

1. OR 연산자와 AND연산자

OR연산자와 AND연산자는 내가 기본적으로 알고 있는 수학적인 기능 빼고는 미쳐 모르고 있었다.
애매하게 알고있음의 무서움을 다시 경험했다. 내가 이미 알고 있다고 생각하는 내용이라서 찾아보지 않고 넘어간 것이다.

아래는 이번에 공부하면서 새로 알게된 내용들이다.

첫 번째 truthy를 찾는 OR 연산자 "||"와 첫 번째 falsy를 찾는 AND 연산자 "&&"

(찾지 못하면 마지막 값이 반환된다.)

내가 눈으로 보는 OR과 AND를 믿고있어서 컴퓨터적 동작이 어떻게 되는지는 미쳐 생각을 하지 못했었다.
모던 자바 튜토리얼를 읽다가 위의 글을 읽으니 한번에 어떻게 or과 and가 동작하는지 이해가 되었다.
OR은 모든 값이 false값중 하나만 true이면 true를 반환한다.

result1 = false || false || true || false;
result2 = false || false || false || false;

console.log(result1); // true
console.log(result2); // false;

이런식으로 말이다.
컴퓨터는 모든 값을 볼 필요가 없다. 비효율적이다. or연산자로 묶여 있는 값을 왼쪽부터 살펴보면서 true 값이 하나라도 나오는 순간 true가 반환되는 동작을 하면 or연산자를 구현할 수 있는 것이다.

이 동작을 응용해서 기본값을 지정해 놓고 값이 falsy일때는 or연산자 맨 뒤에다 지정해 놓은 기본 값을 대입할 수 있다.

let result1 = 1;
let result2 = 0;

result1 = result1 || 2;
console.log(result1) // 1;
result2 = result2 || 2;
console.log(result2) // 2;

이런식으로 사용할 수 있는 것이다.

AND연산자는 위에서 언급했듯이 첫 번째 falsy 값을 찾는다.

let result1 = 1;
let result2 = 0;

result1 = result1 && 2;
console.log(result1) // 2;
result2 = result2 && 2;
console.log(result2) // 0;

이런식으로
result1은 둘다 truthy한 값이니 맨 뒤에있는 숫자 2를 출력한 것이고, result2는 0이라는 falsy한 값을 찾았으니 0을 출력한 것이다.

새로알게된 NULL 병합 연산자 "??"

"??"연산자는 OR연산자인 "||" 연산자와 비슷하게 작용하나 가장 큰 차이점은 첫번째 falsy값을 찾는 것이 아닌 첫 번째 null이나 undefined가 아닌 피연산자를 찾는 다는 것이다.

let result1 = 0;
let result2 = 0;

result1 = result1 || 1;
console.log(result1) // 1;
result2 = result2 ?? 1;
console.log(result2) // 0;

이렇게 차이를 볼 수 있다.
OR연산자인 "||"연산자는 첫 falsy값인 1을 반환하지만
NULL 병합 연산자인 "??"는 처음 만난 null이나 undefined값이 아닌 값을 찾으니, 초기에 설정되어 있던 result2 === 0가 null이나 undefined가 그대로 다시 들어오는 것이다.

profile
두려움 없이

0개의 댓글