[JavaScript] AND, OR 연산자 정리 (Feat. null 병합 연산자)

Boolean true? false?

False(Falsy) - `false`, `null`, `undefined`, `NaN`, `0`, `""`
Ture(Truthy) - 나머지 값들 ! `{}`, `[]` 빈 객체, 배열도 포함

---

AND 연산자

왼쪽 값이 ture이면 오른쪽 값을 리턴하고, 왼쪽 값이 false이면 왼쪽 값을 리턴

console.log(true && true) // true (오른쪽 값 리턴)
console.log(true && false) // false (오른쪽 값 리턴)
console.log(false && true) // false (왼쪽 값 리턴)
console.log(false && false) // false (왼쪽 값 리턴)

 

OR 연산자

왼쪽 값이 ture이면 왼쪽 값을, 왼쪽 값이 false이면 오른쪽 값을 리턴 (AND 연산자와 반대)

console.log(true || true) // true (왼쪽 값 리턴)
console.log(true || false) // true (왼쪽 값 리턴)
console.log(false || true) // true (오른쪽 값 리턴)
console.log(false || false) // false (오른쪽 값 리턴)

 

AND와 OR의 연산 방식

console.log(null && undefined) // null
console.log(0 || true) // true
console.log('0' && NaN) // NaN
console.log({} || 123) // {}

function print(value) {
    const message = value || 'hwichul';

    console.log(value);
}

print(); // hwichul
print('JavaScript'); // JavaScript

 

AND와 OR 연산자 여러 개 사용하면 우선 순위가 존재한다.

AND 연산자가 OR 연산자보다 우선 순위가 더 높다.

console.log(true || false && false); // true
console.log((true || false) && false); // false
console.log('hwichul' || NaN && false); // hwichul
console.log(('hwichul' || NaN) && false); // false

---

null 병합 연산자

물음표 두개(??)를 사용해서 null, undefined 값을 가려내는 연산자이다.

const example1 = null ?? 'I';
const example2 = undefined ?? 'love';
const example3 = 'eunju' ?? 'JavaScript';

console.log(example1, example2, example3); // I love eunju

 

연산자 왼편의 값이 null, undifined 값이면 오른편 값이 리턴되고, 연산자 왼편의 값이 null, undifined 값이 아니라면 왼편의 값이 리턴되는 원리이다. (OR 연산자와 헷갈릴 수 있음.)