[Javascript] 논리연산자 '&&', '||' , '??' (Javascript 제대로 알고 쓰자) - 2

이번에는 잘 몰랐던 Javascript의 몇가지 논리 연산자에 대해 알아보고자 한다.

첫번째 falsy를 찾는 AND 연산자 '&&'

나는 여태까지 '&&' 연산자를 if문 등에서 조건을 확인할 때만 써오곤 했다.

const con_1 = true;
const con_2 = true;
if (con_1 && con_2) {
  console.log('조건을 만족합니다');
}

하지만 이렇게도 쓸 수 있다.

const con_1 = true;
const con_2 = true;
con_1 && con_2 && console.log('조건을 만족합니다.');

AND 연산자는 아래와 같은 순서로 동작한다.

• 가장 왼쪽 피연산자부터 시작해 오른쪽으로 나아가며 피연산자를 평가.
• 각 피연산자는 불린형으로 변환되며, 변환 후 값이 false이면 평가를 멈추고 해당 피연산자의 변환 전 원래 값을 반환.
• 피연산자가 모두 평가되는 경우 마지막 피연산자가 반환.

라고 말로 설명하는거보다 코드로 설명하는게 더 알기 쉬울거다.

console.log(1 && 0); // 0
console.log(1 && 'string'); // string
console.log(1 && undefined); // undefined

첫번째 truthy를 찾는 OR 연산자 '||'

OR 연산자는 아래와 같은 순서로 동작한다.

• 가장 왼쪽 피연산자부터 시작해 오른쪽으로 나아가며 피연산자를 평가.
• 각 피연산자는 불린형으로 변환되며, 변환 후 값이 true이면 평가를 멈추고 해당 피연산자의 변환 전 원래 값을 반환.
• 피연산자가 모두 평가되는 경우 마지막 피연산자가 반환.

console.log(1 || 0); // 1
console.log(0 || 'string' || null); // string
console.log(0 || undefined || null); // null

null 병합 연산자 '??'

'??' 연산자는 첫번째 정의되어 있는 값을 찾는다.

console.log(0 ?? 1); // 0
console.log(0 ?? 'string' ?? null); // 0
console.log(undefined ?? 0 ?? null); // 0
console.log(null ?? false ?? undefined); // false