[React.js] React 사용을 위한 자바스크립트 응용 - Truthy & Falsy

 

React 게시글은 대부분 인프런의 '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지' 강의를 기반으로 내용을 정리했습니다.

 

Truthy와 Falsy

자바스크립트에서는 참 같은 값(Truthy)과 거짓 같은 값(Falsy)이 존재한다. 참이면 참이지 참 같은 값은 뭘까? true와 false를 담을 수 있는 boolean 타입 말고도 다른 데이터 타입에서 true와 false를 반환할 수 있다.

let a = "";

if(a) {
  console.log("true");
} else {
  console.log("false");
}

위의 코드에서 어떤 값이 출력될까? 자바스크립트에서는 빈 문자열을 false로 인식해 else문에 있는 명령문을 실행한다. 따라서 false가 출력된다. 그럼 a 변수에 빈 문자열이 아닌 문자열을 넣으면 어떻게 될까?

let a = "a";

if(a) {
  console.log("true");
} else {
  console.log("false");
}

위의 코드는 true를 반환한다. 

 

Truthy로 평가되는 값

1. [] : 빈 배열
2. {} : 빈 객체
3. function() {} : 빈 함수
4. 34 : 숫자
5. "0" : 문자열
6. Infinity : 양의 무한대

 

Falsy로 평가되는 값

1. null
2. undefined
3. 0 : 숫자 0
4. -0 : 숫자 -0
5. NaN
6. "" : 빈 문자열