[JS] Truthy & Falsy

 

 

참 같은 값, 거짓 같은 값

 

Truthy? Falsy? 무엇을 의미할까?

 

 실제 true값이나 false값을 넣지 않더라도 Javascript에서 true와 false로 해석하는 값을 말한다. 이는 javascript의 동작원리로 인해 일어난다. javascript는 자신만의 기준으로 true값과 false값으로 해석한다. 자신만의 기준이 뭘까? 아래에서 한 번 알아보자.

let a = [];

console.log(a) /// true

 위의 빈 배열은 왜 true값으로 출력될까? 실제 값이 true가 아니더라도 javascript에서 true로 해석하는 값들이 몇 개 있다.

 

let a = {};

let b = 33;

let c = "false";

let d = Infinify;

let e = [];

위 값들은 javascript가 true로 인식하는 자신만의 기준들이다. 그럼 javascript가 false로 해석하는 값들은 어떤 것들이 있을까?
아래는 false로 인식하는 값들이다.

 

let a = null;

let a = undefined;

let a = 0;

let a = -0;

let a = NaN;

let a = "";

위의 truthy한 값들과 falsy한 값들은 코딩할 때 굉장히 유용하게 작성할 수 있다. 

 

const getName = (person) => {
	return person.name;
}

let person = { name: "유정인" }
const name = getName(person);

console.log(name) /// 유정인

위 코드에서 getName에 전달하는 person파라미터가 name이라는 프로퍼티를 갖고 있는 객체를 전달하여 아무런 문제없이 실행할 수 있었다. 만약 person의 값을 undefined로 전달하면 어떻게 될까??

 

undefined가 객체가 아니기 때문에 내부 name프로퍼티에 접근할 수 없어 TypeError가 발생한다. 에러를 해결하기 위해서는 undefined일때, return값을 줘서 예외처리를 해주면 해결된다. 그렇다면 person.name의 예외처리는 어떻게 작성할 수 있을까?

 

const getName = (person) => {
	if (person === undefined) { /// person이 객체가 아닐때 예외처리
    	return "객체가 아닙니다."
    }
	return person.name;
}

let person
const name = getName(person);

console.log(name) /// 유정인

그러나 위 코드는 undefined일때만 예외처리를 하는 코드이다. 만약 위 코드에 null값이 들어가면? 이전과 같이 TypeError가 나온다. null값이 들어갔을 때에도 예외처리를 할 수 있도록 코드를 재구성해보자 !!

 

const getName = (person) => {
	if (person === undefined || person === null) {
    	return "객체가 아닙니다."
    }
	return person.name;
}

let person = null;
const name = getName(person);

console.log(name) /// 유정인

 

실제 프로젝트를 진행한다면.. 위 코드의 예외처리는 수 도 없이 일어날테고, 코드 작성시 마다 예외처리를 위와 같은 코드로 작성해야 한다. 단순히 보기에도 가독성이 떨어지고, 반복해야 할 코드가 길어질 것 같다.

 

 

Truthy & Falsy 를 어떻게 유용하게 작성하는가?

 

 

위 코드에서 falsy한 값들을 간단한 코드로 한 번에 처리할 수 있다.

 

const getName = (person) => {
	if (!person) { /// !
    	return "객체가 아닙니다."
    }
	return person.name;
}

let person = null;
const name = getName(person);

console.log(name) /// 유정인

 if (person) 은 true한 값이다. 그러나 우리가 person에 null값과 undefined값을 넣기 때문에 falsy한 값이 된다. 우리는 위에서 falsy한 값들이 입력되는 예외상황들을 if 문에 하나 하나 입력하였다. 그러나 if (!person) 구문 하나로! true이외에 falsy한 모든 값들을 예외처리할 수 있다!