truthy와 falsy

자바스크립트 문법까지는 아니지만, 알아둬야 하는 개념이다.

Truthy: true 같은
Falsy: false 같은

끝.

function print(person) {
  console.log(person.name);
}

const person = {
  name: 'John'
};

print(person);

만약에 이러한 상황에서, 만약 print 함수가 다음과 같이 파라미터가 비어진 채로 실행됐다고 가정해보자

print();
//TypeError: Cannot read property 'name' of undefined

이러한 상황에서, 만약에 print 함수에서 만약에 object 가 주어지지 않았다면, 문제가 있다고 콘솔에 출력해야 한다면 다음과 같이 구현 할 수 있다.

function print(person) {
  if (person === undefined) {
    return;
  }
  console.log(person.name);
}

print();

그런데 만약에 다음과 같이 print 에 null 값이 파라미터로 전달된다면?

const person = null;
print(person);
//TypeError: Cannot read property 'name' of null

또 하나의 조건을 추가한다.

function print(person) {
  if (person === undefined || person === null) {
    console.log('person이 없네요');
    return;
  }
  console.log(person.name);
}

이렇게 person 이 undefined 이거나, null 인 상황을 대비하려면 위와 같이 코드를 작성해야한다. 여기서 위 코드는 다음과 같이 축약해서 작성 할 수 있다.

function print(person) {
  if (!person) {
    console.log('person이 없네요');
    return;
  }
  console.log(person.name);
}

이게 작동하는 이유는, undefined 와 null 은 Falsy 한 값이기 때문이다.

Falsy 한 값 앞에 느낌표를 붙여주면 true 로 전환된다.

console.log(!undefined);
console.log(!null);
console.log(!0);
console.log(!'');
console.log(!NaN);

이 값은 모두 true 가 된다. 이처럼 Falsy 한 값은 나열한 다섯가지이다. 그리고, 그 외의 값은 모두 Truthy 한 값이 된다.

추가적으로, 특정 값이 Truthy 한 값이라면 true, 그렇지 않다면 false 로 값을 표현하는 것을 구현해보자

const value = { a: 1 };

const truthy = value ? true : false;

우리가 이전에 배운 삼항연산자를 사용하면 쉽게 value 값의 존재 유무에 따라 쉽게 true 및 false 로 전환이 가능하다.

그런데, 이를 더 쉽게 할 수도 있다.

const value = { a: 1 };
const truthy = !!value;

!value 는 false 가 되고, 여기에 !false 는 true 가 되어서, 결과는 true 가 된다.

Reference

• velopert gitbook