[Javascript] boolean / null / undefined

JS boolean, JS null, JS undefined, JS boolean / null / undefined, JS falsy

정의

JavaScript 의 3 가지 primitive.

• boolean : true, false
• null : 의도적인 “없음”
• undefined : 자동으로 부여된 “없음” (초기화 안 됨)

boolean

const a = true;
const b = false;

// 연산자
true && false      // false
true || false      // true
!true               // false

falsy / truthy

JavaScript 가 boolean 으로 강제 변환할 때 false 가 되는 값들 (falsy):

Boolean(false)        // false
Boolean(0)            // false
Boolean(-0)           // false
Boolean(0n)           // false (BigInt zero)
Boolean('')           // false
Boolean(null)         // false
Boolean(undefined)    // false
Boolean(NaN)          // false

// 나머지 모두 truthy
Boolean([])           // true (빈 배열도!)
Boolean({})           // true (빈 객체도!)
Boolean('false')      // true (문자열 'false' 는 truthy)

null vs undefined

특성	null	undefined
의미	의도적 비어있음	미초기화
자동 부여	✗ (직접 할당)	✓
typeof	'object' (역사적 버그)	'undefined'
JSON.stringify	null	키 자체 제외
기본 함수 매개변수	적용 안 됨	적용됨

function foo(x = 10) {
    return x;
}
foo();              // 10 (undefined → default)
foo(undefined);     // 10
foo(null);          // null (default 적용 안 됨)

== 와 === 의 차이

null == undefined    // true (특수 케이스)
null === undefined   // false

null == 0            // false
null < 1             // true (관계 연산자는 강제 변환)
null > 0             // false
null >= 0            // true (모순처럼 보임)

이런 함정 때문에 항상 === 권장.

비어있음 검사 idiom

// 안 좋은 패턴
if (x == null) { ... }       // null 과 undefined 모두 매치 (의도라면 OK)

// 명시적 검사
if (x === null) { ... }
if (x === undefined) { ... }
if (x == null) { ... }       // 둘 다 (== 는 강제 변환)

// nullish coalescing
const value = x ?? 'default';   // null/undefined 만 default

// optional chaining
obj?.prop?.subprop

void 연산자

void 0           // undefined
void 'anything'  // undefined

undefined 를 안전하게 얻는 옛 idiom (옛 JS 에서 undefined 는 재할당 가능했음). 모던에선 불필요.

명시적 boolean 변환

Boolean(x)        // 권장
!!x                // 같음 (NOT NOT)

함정

1. typeof null

typeof null      // 'object'  (역사적 버그)
typeof undefined // 'undefined'

null 검사는 === null 사용.

2. NaN 의 truthy

Boolean(NaN)     // false
NaN == NaN       // false
NaN === NaN      // false
Number.isNaN(NaN)  // true

3. 빈 문자열의 비교

'' == false      // true
'' === false     // false
'' < 1           // true ('' → 0)

4. 객체의 truthy

const obj = {};
if (obj) { ... }    // 항상 true (객체 = truthy)
if (Object.keys(obj).length === 0) { ... }   // 진짜 empty 검사

모범 사례

1. === 와 !== 만 사용
2. ?? (nullish coalescing) 으로 null/undefined 만 fallback
3. 명시적 boolean 검사, === null, Array.isArray, obj.length === 0 등
4. Boolean() 또는 !! 로 명시적 변환

참고

• JS 타입 변환
• JS Number
• JS Optional Chaining