JavaScript의 `truthy`와 `falsy`

이 글은 JavaScript에서의 truthy와 falsy를 설명합니다.

YouTube Video

JavaScript의 truthy와 falsy

JavaScript의 truthy와 falsy 개념은 특히 조건문 평가에서 매우 중요한 역할을 합니다. Truthy와 falsy는 값이 true(true) 또는 false(false)로 평가되는지 여부를 결정하지만, 이 값들은 반드시 불리언 true나 false 자체는 아닙니다.

Falsy 값들

Falsy 값은 JavaScript 조건문에서 false로 평가되는 값을 나타냅니다. 아래는 JavaScript에서 falsy 값들의 목록입니다.

 1const values = [
 2    false,
 3    0,
 4    -0,
 5    0.0,
 6    -0.0,
 7    0n,
 8    -0n,
 9    "",
10    null,
11    undefined,
12    NaN
13];
14
15for (let value of values) {
16    if (value) {
17        console.log(`${value} is truthy`);
18    } else {
19        console.log(`${value} is falsy`);
20    }
21}

이 예제에서 모든 falsy 값은 "falsy"로 출력됩니다. 아래는 JavaScript에서 falsy 값들의 목록입니다.

• false — Boolean 타입에서의 false
• 0 — 숫자 0 (소수점 표현인 0.0도 falsy입니다)
• -0 — 음의 0 (기술적으로 0과는 다르지만, falsy입니다)
• 0n — BigInt 타입에서의 0
• "" — 길이가 0인 빈 문자열
• null — 존재하지 않는 값
• undefined — 정의되지 않은 값
• NaN — 숫자가 아님

이 값들은 논리 연산과 조건문(예: if문)에서 false로 간주됩니다.

Truthy 값들

Falsy가 아닌 모든 값은 truthy입니다. 이는 불리언 true로 평가되는 값을 나타냅니다. JavaScript에서는 많은 값들이 truthy로 간주됩니다.

 1const values = [
 2    true,
 3    1,
 4    -1,
 5    "Hello",
 6    " ",
 7    [],
 8    {},
 9    function() {},
10    Symbol(),
11    Infinity
12];
13
14for (let value of values) {
15    if (value) {
16        console.log(value, ' is truthy');
17    } else {
18        console.log(value, ' is falsy');
19    }
20}

이 코드에서는, truthy 값이 "truthy"로 출력됩니다. 예를 들어, 다음 값들은 truthy입니다.

• true — Boolean 타입에서의 true
• 숫자(0이 아닌 경우) — 예를 들어, 1과 -1도 참 값(truthy)입니다.
• 문자열(비어 있지 않은) — 예를 들어, "Hello" 또는 " " (공백만 있는 문자열도 truthy입니다.)
• 객체 — 빈 객체({})와 배열([])조차도 참 값(truthy)입니다.
• 함수 — 함수 자체도 참 값(truthy)입니다.
• Symbol — Symbol 타입의 값도 truthy입니다.
• Infinity — 양의 무한대와 음의 무한대 모두 참 값(truthy)입니다.

truthy와 falsy의 활용

truthy와 falsy의 개념은 조건문과 논리 연산에서 자주 사용됩니다. 예를 들어, || (논리 OR) 연산자를 사용하여 기본값을 설정할 때, 첫 번째 truthy 값이 결과로 반환됩니다.

falsy 값을 확인하는 방법

falsy 값을 확인하려면 Boolean 함수를 사용하는 것이 편리합니다. Boolean 함수는 주어진 값을 명시적으로 boolean 타입으로 변환합니다.

Boolean 함수의 예

 1const values = [
 2    false,
 3    0,
 4    "",
 5    null,
 6    undefined,
 7    NaN
 8];
 9
10for (let value of values) {
11    console.log(`${value} is ${Boolean(value) ? 'truthy' : 'falsy'}`);
12}

결론

JavaScript에서 truthy와 falsy는 비-boolean 값이 조건식에서 어떻게 평가되는지 이해하는 데 중요합니다. falsy 값에는 false, 0, 빈 문자열, null, undefined, NaN이 포함되며, 그 외의 모든 값은 truthy로 평가됩니다. 이러한 개념을 이해하면 더 유연하고 효율적인 코드를 작성할 수 있습니다.

위의 기사를 보면서 Visual Studio Code를 사용해 우리 유튜브 채널에서 함께 따라할 수 있습니다. 유튜브 채널도 확인해 주세요.

YouTube Video