개발 지식 - 트루시(Truthy)와 폴시(Falsy)

이유승·2024년 11월 24일
0

개발 지식

목록 보기
28/29
post-thumbnail
  • 조건문이나 논리적 평가에서 값이 참(또는 참으로 간주)인지, 거짓(또는 거짓으로 간주)인지 판단하는 개념.

1. Javascript에서 불리언(Boolean)은 생각보다 범위가 넓다.

  • 불리언(Boolean) 값을 사용할 때, true와 false만 사용할 수 있는게 아니다.

  • true 혹은 false로 간주되는 값들이 존재하기 때문.

  • Falsy 값에 해당하지 않는 모든 값은 Truthy로 간주한다.



폴시(Falsy)

  • 자바스크립트에서 Falsy로 간주되는 값은 7가지.



false

Boolean의 기본 거짓 값.

0 (숫자 0)

양의 0과 음의 0(+0, -0) 모두 포함.

NaN

"Not-a-Number" 값.

null

값이 없음을 나타내는 값.

undefined

초기화되지 않은 변수나 정의되지 않은 값.

"" (빈 문자열)

길이가 0인 문자열.

-0

음의 0 (일반적으로 0과 같은 값으로 간주).



트루시(Truthy)

  • 폴시(Falsy)로 간주되지 않는 나머지 전부.

숫자

1, -1, 42, Infinity, -Infinity 등 0이 아닌 모든 숫자.

문자열

"hello", "false", " " (빈칸만 있는 문자열 포함).

객체

{}, [] (빈 객체와 빈 배열 포함).

함수

function() {}, 화살표 함수 등.

특수값

Symbol(), BigInt(10) 등.



2. 어떻게 사용할 수 있는가?

조건문 간소화

let value = "Hello, World!";

if (value !== null && value !== undefined && value !== "") {
  console.log("Value is valid");
} else {
  console.log("Value is invalid");
}
  • 조건문의 길이가 길다. 가독성이 떨어지는 것은 당연..
let value = "Hello, World!";

if (value) {
  console.log("Value is valid");
} else {
  console.log("Value is invalid");
}
  • 긴 조건문을 키워드 하나로 축약시켜버릴 수 있다. 가독성면에서 매우 뛰어나다.
let value = "Hello, World!";

if (!value) {
  console.log("Value is valid");
} else {
  console.log("Value is invalid");
}
  • Falsy 사용을 원한다면 부정 연산자 !를 사용하면 된다.



3. 주의점

1) 빈 객체와 배열

  • 빈 객체 {}와 빈 배열 []은 Truthy.

  • 요청 혹은 응답에서 들어오는 데이터가 없는 상황에서 조건문을 사용할 때, 데이터를 관리하는 데이터 형식은 흔히 객체 혹은 배열이다.

  • 그런데 데이터가 없다 = 객체 혹은 배열이 비어있다. 이렇게 되는데, 빈 객체와 배열도 Truthy로 간주되기 때문에 데이터가 없는 상황을 가정하고 작성한 조건문이 의도대로 동작하지 않을 가능성이 있다.

if ({}) {
  console.log("This is truthy!");
}

if ([]) {
  console.log("This is also truthy!");
}
let items = [];

if (items.length) {
  console.log("Items are present");
} else {
  console.log("No items found");
}
  • 따라서 배열, 객체 등은 해당 데이터의 존재 여부가 아닌, 데이터의 길이 혹은 크기 등을 조건으로 사용해야 한다.

2) 0과 "0"

  • 0은 Falsy지만, "0"은 문자열이므로 Truthy.
console.log(Boolean(0));    // false
console.log(Boolean("0"));  // true
profile
프론트엔드 개발자를 준비하고 있습니다.

0개의 댓글