[JS] 조건문 업그레이드 (연산자) / 단락회로 평가

falsy, truthy 값을 활용해서 유용하게 조건문 처리하기 

 

null과 undefined 예외 처리 간결하게 하는 방법

 

 

⚠️  1. 일반적인 방법 : 논리 연산자 이용하는 방법

전통적이고 생각하기 쉽지만 실제 프로젝트에서는 번거로움

❗ 2. 더욱 유용한 방법 (Truthy & Falsy)

NOT 연산자를 이용하면

 "" false, NaN, undefined, null, 0 총 6가지 기본 데이터 타입는 false로 boolean 타입으로 변환해준다.
그 외에는 모두 true로 변환
thus, undefiend와 null을 걸러내는 예외처리를 조건문으로 구현하고자 할 때 ‘!’만 붙여주면
falsy 타입이 들어오면 NOT과 만나서 true로 반환되기 때문에 매우 유용하다.

 

 

---

 

삼항 연산자 

 

삼항 연산자 중첩해서 사용하기

let score = 66;

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

//그러나 가독성이 안 좋다, 웬만해서는 if문으로 바꿔주는 게 좋다.


let score = prompt("당신의 점수를 적어주세요, 숫자형식");

 if (score >= 90) {
    console.log("A+");
} 
else if (score >= 50 {
console.log("B+"); 
} else {
console.log("F");
};
   

//가독성이 더 좋다

 

 

---

단락회로 평가

: 비교 연산자를 이용하는 것, 피연산자중에 뒤에 피연산자를 확인할 필요 없이 연산을 끝내버리는 것을

단락회로평가라고 이야기한다.

 

truthy와 falsy를 사용하면 단락회로 평가를 아주 멋있게 사용할 수 있다.

 

 

const getName = (person) => {
  const name = person && person.name;
  //and 연산자니까 trushy여야 트루시로 넘김 // 이치윤 저장
  return name || "객체가 아닙니다";
  //or 연산자에서는 하나만 trushy면 이미 truthy하니까 뒤에 볼 것도 없이
//  그냥 이치윤 출력하게 됨 
};


let person = null;

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




null일때는 어떻게 될까? 



//반대로 falsy는 
const getName = (person) => {
  const name = person && person.name;
  //null이기 때문에 name에는 falsy 할당
  return name || "객체가 아닙니다";
  //  falsy가 넘어갔는데 처음부터 falsy니까 name은 넘어가고
  // trutshy 속성인 문구 반환
};

 

 

 

---

조건문 업그레이드

 

 

논리 연산자를 사용하는 것에서 멈추지 않고 더 간결하게 할 수 있는 방법이 있다.

 

 

예제1 ) 배열 내장 함수 includes(); 사용하기

 

//인자로 받은 문자열이 포함되어있는지 아닌지로 boolean타입으로 
//반환해주는 함수를 만들때 includes(); 메서드를 쓰면 좋다.

function isKoreanFood(food) {
if (["불고기", "떡볶이", "비빔밥"].includes(food)) {
	return true;
}

return false;
}

const food1 = isKoreanFood("불고기");
const food2 = isKoreanFood("파스타");
console.log(food1);
console.log(food2);

// 결과 true false true false

 

 

예제2) 원하는 나라 입력하면 그 나라 음식 리턴해주는 함수 만들기

 

 

 

⚠️ 1. if를 서서 원시적으로 구현하는 방법

 

단점은 나라와 메뉴가 많아지면 일일히 하기에는 답이 안나옴

 

 

 

❗ 2. 객체의 점 표기법으로 구현하기

!Remind! 
“프로퍼티 접근법 2가지"

*프로퍼티 : ’키’와 ‘값'쌍으로 구성

점 표기법 : obj.property
대괄호 표기법 : obj[”property”]

 

const game = { 
 액션 : "검은 사막",
 슈팅 : "배틀필드 온라인",
 롤프레잉 : "거상",
 전략 : "스타크래프트",
 스포츠 : "피파"
};
const pickGame = (gameType) => {
 return game[gameType] || "그 장르는 없어요"
};

console.log(pickGame("슈팅"));
console.log(pickGame("스포츠");
console.log(pickGame("낚시게임");

//결과 

배틀필드 온라인
피파
그 장르는 없어요