[JavaScript] 자바스크립트 조건문 Upgrade

S0ju·2022년 5월 24일
0

JavaScript

목록 보기
16/22

주어진 문자열이 한식 종류에 해당하는지를 검사하는 함수를 만들어보자(함수선언식으로)

funtion isKoreanFood(food){
  if(food === "불고기" || food === "비빔밥" || food === "떡볶이"){
    return true;
  }
  return false;
}

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

우리가 존재하는 모든 한식들을 검사해야 한다면 이 조건식은 굉장히 길어지게 될 것

이런 상황은 switch-case를 이용해도 case가 너무 많아지기 때문에 큰 의미X

이럴때는 문제를 바꿔서 생각해보자
굉장히 여러가지 한식의 종류가 있는데 대부분 문자열일 것
문자열로 이루어진 한식들중에 입력받은 파라미터가 존재하는지 안하는지를 확인하면 됨

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

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

배열의 내장메소드 includes(파라미터가 배열에 존재하면 true, 존재하지 않으면 false를 리턴하는)를 활용해서 복잡한 조건문을 간단하게 간추릴 수 있음

첫번째로 알아본건 여러가지 케이스들 중 하나인지를 비교할 때 배열의 내장함수인 includes를 사용하면된다는 것을 배움


이번에는 주어진 값에 따라 각각 다른 결과를 반환하는 함수를 만들어보자

한식인지 양식인지 중식인지 일식인지를 받고 그것의 각각 대표메뉴를 리턴해주는 함수를 만들어보자👇

const getMeal = (mealType) => { //화살표 함수
  if(mealType === "한식")
    return "불고기";
  if(mealType === "양식")
    return "파스타";
  if(mealType === "중식")
    return "멘보샤";
  if(mealType === "일식")
    return "초밥";
  return "굶기";
};

console.log(getMeal("한식")); //불고기
console.log(getMeal("중식")); //멘보샤
console.log(getMeal()); //굶기

mealType이라는 파라미터 이름으로 한식인지 양식인지 중식인지 일식인지 받도록 한다

만약 식사유형이 존재하는 모든 국가를 모두 포함해야 한다면 굉장히 끔찍😫

이것을 우리는 객체의 프로퍼티에 접근하는 괄호표기법을 이용해서 혁신적으로 해결 가능

const meal = {
  한식 : "불고기",
  중식 : "멘보샤",
  일식 : "초밥",
  양식 : "스테이크",
  인도식 : "카레"
};

const getMeal = (mealType) => { //화살표 함수
  return meal[mealType] || "굶기";
};

console.log(getMeal("한식")); //불고기
console.log(getMeal()); //굶기

meal이라는 객체는 음식의 유형과 그 유형의 가장 대표적인 음식 한가지를 가지고 있음

동작원리 -> getMeal 함수를 호출할 때 mealType에 "한식"이라는 값을 전달했기 때문에 meal이라는 객체에서 한식이라는 key를 갖는 값을 가져오게됨

이런식으로 굉장히 많은 유형의 대표적인 무언가 하나를 리턴해야될 때 객체의 괄호표기법을 이용해서 효율적으로 해결 가능!⭐

profile
프론트엔드 개발자가 되기 위해 공부중입니다 : )

0개의 댓글