본문 바로가기

JS/JavaScript

19. Truthy와 Falsy, 삼항연산자, 단락회로 평가, 조건문 응용

1.  Truthy와 Falsy

let a = "";

if (a) {
  console.log("TRUE");
} else {
  console.log("FALSE");
}
// 결과: FALSE

//---------------------

let a = "string";

if (a) {
  console.log("TRUE");
} else {
  console.log("FALSE");
}
// 결과: TRUE

 

변수 a에 문자열 말고 객체, 빈 배열, 빈객체, 숫자형, infity 등이 들어가도 true로 반환이 된다.

이처럼 JS에서는 조건식에서 실제로 true가 아님에도 '참(ture)'같은 값으로 분류하는 truty가 있다. 

반면 null, undefined, 0, -0, NaN, ""(빈문자열)의 경우에는 falsy가 된다. 

 

 

활용 

const buy = (fruit) => {
  return fruit.name;
};

let fruit = { name: "사과" };

const name = buy(fruit);

console.log(name); // 결과: 사과


// 하지만 만약 fruit가 falsy의 속성을 가진 자료형이라면?
// ex: let fruit = null;
// TypeError: Cannot read properties of null (reading 'name') 오류 발생

객체의 속성에 전달하려면 해당 객체가 존재하고 속성 또한 정의되어 있어야 하는데 undefined나 null은 객체가 아니기 때문에 객체의 속성에 접근하려고 할 때 타입오류가 발생할 수 있다. 

(undefined: 변수가 선언되었으나 값이 할당되지 않음  /  null: 값이 의도적으로 비어있음) 

 

const buy = (fruit) => {
  if(fruit === undefined || fruit === null){
    return "객체가 아님."
  }
  	return fruit.name;
};
// 이런식으로 파라미터가 객체가 아니라면 "객체가 아님"이라는 문구를 출력하여 에러를 발생시키지 않을 수 있다. 
// 하지만 'fruit === undefined || fruit === null' 이렇게 조건식을 넣어 예외처리하는 것은 무리가 있다.
// (falsy의 경우는 더 있기 때문에) 
// 이때 조건문을 '!fruit'을 해도 같은 결과가 나온다.

let fruit = null;

const name = buy(fruit);

console.log(name);

 

 

2. 삼항연산자 

조건 ? ture일 때 수행될 것 : false일 떄 수행될 것 

let name = "홍길동";

// if 조건식
if (name === "홍길동") {
  console.log("이름은 홍길동");
} else {
  console.log("홍길동 아님");
}

// 삼항연산자
name === "홍길동" ? console.log("이름은 홍길동~~") : console.log("홍길동 아님~~");

이렇게 삼항연산자를 사용하면 조건문을 간단하게 작성할 수 있다. 

 

또한 삼항연산자는 아래와 같이 중첩하여 두 개 이상의 조건도 작성할 수 있다. 

let score = 69;

score >= 90
  ? console.log("A")
  : score >= 80
  ? console.log("B")
  : console.log("C"); 
// 결과: C

if(score>=90) {
  console.log("AA")
} else if(score>=80){
  console.lof("BB")
} else{
  console.log("FF")
}
// 결과: C

 

그러나 삼항연산자를 중첩으로 사용할 경우 가독성이 떨어지니 조건이 많다면 if조건문을 쓰는게 가독성 면에서 좋다. 

 

 

3. 단락회로 평가 

논리곱(&&)과 논리합(||)에서 사용되는 것으로 논리식 전체를 평가하지 않고, 필요한 최소한의 평가만 수행하여 결과를 결정한다. 

 

① 논리곱(&&) 

 - 첫 번째 피연산자가 false로 평가되면 두 번째 피연산자는 평가하지 않고 false로 결정된다.(두 값이 true일 때만 true이기 때문) 

 - 첫 번째 피연산자가 true로 평가되면 두 번째 피연산자의 평가 결과에 따라 결과가 결정된다. 

 

② 논리합(||)

 - 첫 번째 피연산자가 tru로 평가되면 두 번째 피연산자를 평가하지 않고 결과가 true가 된다.(하나만 true여도 true이기 때문) 

 - 첫 번째 피연산자가 false로 평가되면 두 번째 피연산자의 평과 결과에 따라 결과가 결정된다. 

 

단락 회로평가는 조건부 할당이나 조건문에서 유용하게 사용될 수 있다.

예를 들어 사용자가 입력한 이름이 있다면 그 이름을 사용하고 없다면 "기본이름"이라는 기본 값을 줄 수 있다. 

const name = "사용자가 입력한 이름";
console.log(name || "기본이름");  // 결과: 사용자가 입력한 이름

const name2 = null;
console.log(name2 || "기본이름"); // 결과" 기본이름

 

 

4. 조건문 응용하기 

const getTeacher = (subject) => {
  if(subject == "국어") return "김흥부";
  if(subject == "수학") return "김놀부";
  if(subject == "영어") return "박까치";
  return "해당 과목의 선생님 없음";
}

console.log(getTeacher("국어")); // 결과: 김흥부
console.log(getTeacher("과학")); // 결과: 해당 과목의 선생님 없음

위의 조건문은 만약 과목이 많아진다면 작성과 관리가 힘들 것이다. 

아래와 같이 응용할 수 있다. 

const subject = {
  국어 : "김흥부", 
  수학 : "김놀부", 
  영어 : "박까치", 
  과학 : "홍길동", 
  사회 : "임꺽정"
};

const getTeacher = (subjectType) => {
  return subject[subjectType] || "해당 과목 선생님 없음";
}

console.log(getTeacher("영어"));      // 결과: 박까치
console.log(getTeacher("컴퓨터일반"));  // 결과: 해당 과목 선생님 없음

 

'JS > JavaScript' 카테고리의 다른 글

20. 동기와 비동기, Promise, async&await  (0) 2023.05.20
18. 콜백함수  (0) 2023.05.18
17. 배열 내장 함수  (0) 2023.05.18
16. 기본, 참조 자료형 / 배열 함수 map()  (0) 2023.03.25
15. Spread & Rest Operator / Destructuring  (0) 2023.03.25