1. Truthy와 Falsy의 개념
JavaScript에서는 모든 값을 논리적 참(true) 또는 거짓(false)으로 평가할 수 있습니다.
이러한 특성을 이용한 것이 Truthy와 Falsy입니다.
1-1) Falsy 값의 종류
JavaScript에서 다음 7가지 값은 항상 거짓으로 평가됩니다:
- undefined
- null
- 0
- -0
- NaN
- "" (빈 문자열)
- 0n (BigInt zero)
1-2) Truthy 값의 특징
위의 Falsy 값들을 제외한 모든 값은 Truthy로 평가되며, 다음과 같은 값들이 포함됩니다:
- 모든 문자열 ("hello")
- 모든 숫자 (0 제외)
- 빈 배열 ([])
- 빈 객체 ({})
- 함수 (() => {})
2. 실전 활용 패턴
2-1) 기본적인 조건 체크
// 아래와 같이 정의할 경우 "문과생"이 출력
let person = {name : "문과생"};
function printName(person){
console.log(person.name)
}
printName(person);
>> "문과생" 출력
만약, 매개변수 값이 정의되지 않았다면?
let person2;
printName(person2);
>> person2은 undefined라서 name 포로퍼티를 읽을 수 없다. 에러 발생
이러한 것을 방지하기 위해 활용되는 것이 Truthy & Falsy 이다.
function printName1(person){
if(!person){
console.log("person의 값이 없음");
return;
}
console.log(person.name);
}
printName1(person);
prtinName1(person2);
> 출력값 : "문과생"
> 출력값 : "person의 값이 없음"
3. 단락 평가(Short-circuit Evaluation)
단락 평가는 논리 연산자를 사용한 조건부 실행을 더욱 간결하게 만들어줍니다.
function printName(person) {
const name = person && person.name;
console.log(name || "person의 값이 없음");
}
3-1) OR 연산자 (`||`) 동작 방식
- `Truthy || anything` → 첫 번째 피연산자 반환
- `Falsy || anything` → 두 번째 피연산자 반환
3-2) AND 연산자 (`&&`) 동작 방식**
- `Falsy && anything` → 첫 번째 피연산자 반환
- `Truthy && anything` → 두 번째 피연산자 반환
4. 실무에서의 응용
4-1) 기본값 설정**
const greeting = (name) => {
const userName = name || "Guest";
console.log(`Hello, ${userName}!`);
}
let user1 = "문과생";
let user2 ;
greeting(user1);
greeting(user2);
> 출력값 : Hello, 문과생!
> 출력값 : Hello, Guest!
4-2) 옵셔널 체이닝과의 조합
const getUserData = (user) => {
return user?.profile?.settings || defaultSettings;
}
이러한 Truthy/Falsy 개념과 단락 평가는 JavaScript에서 코드를 더 간결하고 안전하게 만드는 핵심적인 패턴입니다.
특히 데이터의 유효성 검사나 기본값 설정 등에서 매우 유용하게 활용됩니다.
'Programming > Javascript' 카테고리의 다른 글
[JS] 구조 분해 할당(Destructuring Assignment)이란? (0) | 2025.01.06 |
---|---|
[JS] 옵셔널 체이닝(Optional Chaining) 이란? (0) | 2025.01.06 |
[JS]JavaScript 객체와 배열 완벽 가이드 (0) | 2025.01.03 |
[JS] 자바스크립트의 조건문 마스터하기: switch문과 if문 완벽 가이드 (1) | 2025.01.03 |
[JS] NULL 병합 연산자 (0) | 2024.09.21 |