[JS] A Truthy or Falsy Value in JavaScript

조건문을 작성할 때 활용하고, 예상치 못한 실행 등을 방지하기 위해 값의 Truthy, Falsy 분류를 잘 알고 있어야 한다.

 

Falsy value

false, 0, -0, 0n, "", null, undefined, and NaN

 

Falsy value 예시)

if (false) {
  // Not reachable
}

if (null) {
  // Not reachable
}

if (undefined) {
  // Not reachable
}

if (0) {
  // Not reachable
}

if (-0) {
  // Not reachable
}

if (0n) {
  // Not reachable
}

if (NaN) {
  // Not reachable
}

if ("") {
  // Not reachable
}

 

+ document.all

typeof document.all
// returns undefined

[참고]

• Why is document.all falsy?
• https://developer.mozilla.org/en-US/docs/Glossary/Falsy
• https://tc39.es/ecma262/#sec-IsHTMLDDA-internal-slot

 

Truthy value

위의 값들을 제외한 모든 값

 

Truthy value 예시)

if (true)
if ({})
if ([])
if (42)
if ("0")
if ("false")
if (new Date())
if (-42)
if (12n)
if (3.14)
if (-3.14)
if (Infinity)
if (-Infinity)

 

활용

The logical AND operator, &&

true && "cat"
// returns "cat"

[] && "cute"
// returns "cute"

첫 번째 object가 truthy이면, AND 연산자는 두 번째 피연산자를 반환한다.

 

 

Boolean

Truthy, Falsy 값을 이제 알고 있으니 Boolean() 객체에서 true or false 반환값을 예측할 수 있다.

 

+ new Boolean(false) == true

const x = new Boolean(false);
if (x) {
  // this code is executed
}

 

 

공부하면서 정리하는 글입니다. 피드백과 공감 환영합니다 😃

 

 

참고 자료

• https://developer.mozilla.org/en-US/docs/Glossary/Truthy
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean
• https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-falsy-bouncer/16014
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean#description