Truthy & Falsy : 참 같은 값, 거짓 같은 값

hyorr·2022년 6월 3일
0

javascript

목록 보기
1/2

자바스크립트 개념에 대해 응용이 필요하여 공부한 것을 정리!
현재 수강하고 있는 리액트 강의(winterlood님의 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지)의 내용을 기반으로 작성하였다.

let a = "";

if (a) {
  console.log("TRUE");
} else {
  console.log("FALSE");
}

조건식에 a라는 변수를 입력 a는 string이라는 자료형으로 이루어져 있다.
빈 문자열을 가진 a라는 변수를 if문의 조건식에 넣으면 거짓으로 인지하여 false를 출력함
boolean 값을 넣지 않으면 모두 거짓으로 인지되는 것인가?

다른 값을 넣어보자

let a = "string";

if (a) {
  console.log("TRUE");
} else {
  console.log("FALSE");
}


빈 문자열을 넣었을 때 false로 인식, 그러나 비어있지 않은 문자열을 넣으니 true를 반환.

자바스크립트의 조건식에는 boolean값을 넣지 않아도 참이나 거짓으로 인식되는 속성이 있다.
자바스크립트가 특정한 기준으로 값을 참이나 거짓으로 분류하는 것이 truthy와 falsy개념.

이 개념과 기준이 무엇인 지 알아보자.

자바스크립트에서 참으로 평가하는 값들이 존재 => Truthy
1. 객체 리터럴
2. 숫자 값, 문자열
3. Infinity(양의 무한대)
true가 아니어도 참으로 분루하는 자바스크립트의 값들을 참같은 값이라 하여 Truthy라고 함

반대로 거짓이 아니어도 거짓이라고 분류하는 것이 Falsy
1. null
2. undefined: 변수에 아무것도 할당하지 않는 상태 모두
3. 숫자 0, -0
4. NaN
5. 빈 문자열

이를 어떻데 활용할 수 있을까?
객체를 매개변수로 받아서 받은 객체에서 특정한 프로퍼티를 반환하는 함수를 포함하는 프로그램

const getName = (person) => {
  return person.name;
}; //person을 파라미터로 받아서 person의 name 속성을 return

let person = { name: "오이" }; //poerson의 name은 오이라는 객체를 만듬
const name = getName(person); //getnAme의 반환값을 name이라는 상수에 저장, person이라는 객체를 전달
console.log(name);

만약에 person이라는 값을 undefined로 전달하면 어떻게 될까?

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

let person; 
const name = getName(person); 
console.log(name);


이런 상황에서는 조건문을 통해 전달받은 파라미터가 객체인지 undefined이 아닌지 null이 아닌 지 등을 핀단해줘야함.

예외처리 방법 1.조건문에 일일이 조건식을 입력

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

let person; 
const name = getName(person); 
console.log(name);

예외처리 방법 2. falsy 속성을 이용하여 예외처리
: null과 undefined는 falsy한 성격을 가지고 있음 => 그래서 !을 붙이면 true가 됨

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

let person;
const name = getName(person);
console.log(name);
profile
느려도 바른 방향으로 가자!

0개의 댓글