JavaScript 응용 #1 Truthy & Falsy, 삼항 연산자, 단락회로 평가

#1 Truthy & Falsy

: 참 같은 값, 거짓 같은 값

//TRUE로 인식되는 경우
let a = "string";
let a = [];
let a = {};
let a = 43;
let a = "false"
let a = Infinity;

//FALSE로 인식되는 경우
let a = null;
let a = "";
let a = undefined
let a;
let a = 0;
let a = NaN;

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

 

< 활용 예시 >

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

let person1 = { name: "이정환" };
const name = getName(person1);
console.log(name); //이정환

let person2;
const name = getName(person2);
console.log(name); //오류 발생

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

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

 

---

#2 삼항 연산자

: 조건문 한 줄로 끝내기!

: 조건문 ? 참일 경우 수행할 명령어 : 거짓일 경우 수행할 명령어

 

< 예시1: 주어진 숫자가 양수인지 음수인지 확인 >

let a = 3;

if (a >= 0) {
  console.log("양수");
} else {
  console.log("음수");
}

//삼항 연산자 이용
a >=0 ? console.log("양수") : console.log("음수"); //양수

 

< 예시2: 빈 배열인지 확인 >

let b = [];

if (b.length === 0) {
  console.log("빈 배열");
} else {
  console.log("빈 배열 아님");
}

//삼항 연산자 이용
b.length === 0 ? console.log("빈 배열") : console.log("빈 배열 아님"); //빈 배열

 

< 예시 3 >

let c = [1, 23];

const arrayStatus = c.length === 0 ? "빈 배열" : "빈 배열 아님";
console.log(arrayStatus); //빈 배열 아님

 

< 예시4: 삼항연산자 + Truthy & Falsy >

let d;

const result = d ? true : false;
console.log(result); //false

 

< 예시5: 학점 계산 프로그램 (삼항연산자 중첩) >

let score = 100;

score >= 90 ? console.log("A") : score >= 50 ? console.log("B") : console.log("F"); //A

//if문을 사용하는 것이 더 가독성이 좋다
if (score >= 90) {
  console.log("A");
} else if (score >= 50) {
  console.log("B");
} else {
  console.log("F");
}

---

#3 단락회로 평가

: 논리 연산자의 특성을 이용 (&&, ||, !)

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

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

 

< 단락회로 평가 이용 예시1 >

const getName = (person) => {
  return person && person.name; //person이 falsy이므로 뒤는 상관 X
};

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

 

< 단락회로 평가 이용 예시2 >

const getName = (person) => {
  const name = person && person.name; //이정환, null
  return name || "객체가 아님"; 
  //person1에서 name이 truthy이므로 뒤는 상관 X
  //person2에서 name이 falsy이므로 뒤가 truthy이므로 return
};

let person1 = { name: "이정환" };
const name1 = getName(person1);
console.log(name2); //이정환

let person2 = null;
const name2 = getName(person2);
console.log(name2); //객체가 아님

 

---

이정환님의 인프런 강의 "한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지"를 참고하여 작성하였습니다.