혼공자 Chapter 3

Chan·2022년 11월 8일
0

혼공자

목록 보기
2/7
post-thumbnail

요약 내용

조건문 if, else, else if, switch, 삼항연산자, 중첩 조건문, 짧은 조건문

조건 분기: 코드가 실행되는 흐름을 변경하는 것

if?

조건에 따라 코드를 실행하거나 실행하지 않을 때 사용

if (불 값 표현식) {
	참일 때 실행
}

if else?

서로 반대되는 상황을 표현하는 구조

if (불 값 표현식) {
	참일 때 실행
} else {
	거짓일 때 실행
}

if 조건문을 2번 사용하지 않아도 된다.
조건 하나를 처리하는 횟수가 줄어들어 실제 성능 향상에 도움이 되기도 한다.

중첩조건문?

if (불 값 표현식) {
	참일 때 실행
} else {
	if(불 값 표현식) {
    	참일 때 실행
    } else {
    	거짓일 때 실행
    }
}

else if?

겹치지 않는 3가지 이상의 조건으로 나눌 때

if (불 값 표현식) {
	참일 때 실행
} else if (불 값 표현식) {
	해당 조건이 참일 때 실행
} else {
	위의 두 값이 다 거짓일 때 실행
}

switch?

switch(자료) { //비교할 값을 입력
	case 조건1:
    break // switch 조건문이나 반복문을 빠져나가기 위해 사용하는 키워드
    case 조건2:
    break
    default: //생략가능
    brake

삼항 연산자?

유일하게 3개의 항을 갖는 연산자이다

불 표현식 ? 참일 때 실행 : 거짓일 때 실행

짧은 조건문?

다른 조건문 코드와 비교했을 때 이해하기 어려우므로 사용하지 말자는 개발자들이 더 많다.

  • OR 연산자 사용

    true || OOO
    불 표현식 || 거짓일 때 실행할 문장

좌변이 참이면 좌변을 실행(우변 무시)
좌변이 거짓이면 우변을 실행

  • AND 연산자 사용

    false && OOO
    불 표현식 && 참일 때 실행할 문장

좌변이 거짓이면 우변을 실행하지 않는다
양변이 모두 참이어야 한다.

: 컴퓨터에게 적합한 조건을 찾기 위해 다른 사람의 코드를 보면서 많이 경험해 보는 것이 좋다

오늘 리뷰?

책마다 부르는 이름이 다른 것 같다.
어떤 곳에서는 AND 연산자로 불렸는데 혼공자 책에는 논리곱 연산자로 불렸다.
삼항 연산자도 이 책에서는 조건부 연산자로 불렸다.

마지막에 썼던 말처럼 다른 사람들의 코드를 보면서 경험을 해봐야할 것 같다.
이론을 배우고 있지만 아직 실무에 응용하기가 어렵다.
어느 부분에서 어떻게 사용되는지를 이해해야 하니 책에 있는 누적예제들도 여러 방법으로 해결해 보려고 해야겠다.

예제 연습

태어난 연도를 받아 무슨 해인지 출력하는 프로그램 구현

// if 문 계속 반복되는 코드
<script>
      const rawInput = prompt("태어난 해를 입력해주세요", "");
      const year = Number(rawInput);
      const e = year % 12;
      const g = year % 10;

      let tts = [
        "신",
        "유",
        "술",
        "해",
        "자",
        "축",
        "인",
        "묘",
        "진",
        "사",
        "오",
        "미",
      ];

      let eResult;
      if (e === 0) {
        eResult = tts[0];
      } else if (e === 1) {
        eResult = tts[1];
      } else if (e === 2) {
        eResult = tts[2];
      } else if (e === 3) {
        eResult = tts[3];
      } else if (e === 4) {
        eResult = tts[4];
      } else if (e === 5) {
        eResult = tts[5];
      } else if (e === 6) {
        eResult = tts[6];
      } else if (e === 7) {
        eResult = tts[7];
      } else if (e === 8) {
        eResult = tts[8];
      } else if (e === 9) {
        eResult = tts[9];
      } else if (e === 10) {
        eResult = tts[10];
      } else if (e === 11) {
        eResult = tts[11];
      }

      let gans = ["경", "신", "임", "계", "갑", "을", "병", "정", "무", "기"];

      let gResult;
      if (g === 0) {
        gResult = gans[0];
      } else if (g === 1) {
        gResult = gans[1];
      } else if (g === 2) {
        gResult = gans[2];
      } else if (g === 3) {
        gResult = gans[3];
      } else if (g === 4) {
        gResult = gans[4];
      } else if (g === 5) {
        gResult = gans[5];
      } else if (g === 6) {
        gResult = gans[6];
      } else if (g === 7) {
        gResult = gans[7];
      } else if (g === 8) {
        gResult = gans[8];
      } else if (g === 9) {
        gResult = gans[9];
      }

      console.log(`${year}년에 태어났다면 ${gResult}${eResult}년입니다.`);
    </script>

해당 코드를 반복문으로 수정해보려고 한다.
숫자가 반복되니까 for문으로 반복실행을 해보려고 한다.
생각한 대로 적용이 된다면 코드 수를 반 이상 줄일 수 있을 것이고 속도도 빨라질 것이다.

for (let i = 0;i < tts.lengh; i++) {
	if(e === [i]) {
    eResult = tts[i]
} // 실패..

if 대신 switch (true) {
          case e === [i]:
            eResult = tts[i];
            break;
        } // 도 실패...

else if 이후로 적용이 안되어서 그런 것 같다.
다른 방법으로 시도해 보아야겠다.

for문을 사용하지 않고 배열로 적용해야 하는 것 같다.
처음부터 0~11까지, 0~9까지 차례로 진행되는 숫자로 for 반복문으로 연결시켰는데
잘못 생각한 것 같아 다른 방법으로 시도했다.

<script>
  const rawInput = prompt("태어난 해를 입력해주세요", "");
  const year = Number(rawInput);
  const e = year % 12;
  const g = year % 10;

  let tts = ["신", "유", "술", "해", "자", "축", "인", "묘", "진", "사", "오", "미"];
  let gans = ["경", "신", "임", "계", "갑", "을", "병", "정", "무", "기"];
      
  console.log(`${year}년에 태어났다면 ${gans[g]}${tts[e]}년입니다.`);
</script>

console 표시 >> 1960년에 태어났다면 경자년입니다.

해당 방법으로 반복되는 if문들이 사라지고 몇줄로 깔끔해졌다.
처음에 생각한 for문은 아니었지만 꼭 for문에 꽂히지 말고 여러가지 방면으로 생각해봐야겠다...

수정

for문으로 기술매니저님께 질문해서 for문 사용 가능한 것을 확인했다.
문제는 코드들의 위치 때문이었다.
역시 console.log나 변수의 위치가 어디냐에 따라 결과값이 달라지는 거였다.
변수 scope의 문제였다.

<script>
  const rawInput = prompt("태어난 해를 입력해주세요", "");
  const year = Number(rawInput);
  const e = year % 12;
  const g = year % 10;

  let tts = ["신", "유", "술", "해", "자", "축", "인", "묘", "진", "사", "오", "미"];
  let eResult; // 이 변수의 위치 (global scope)
  
  for (let j = 0; j < tts.length; j++) {
    if (e === j) { // j를 대괄호로 표시했던 점 수정
      eResult = tts[j];
    }
  }
  
  let gans = ["경", "신", "임", "계", "갑", "을", "병", "정", "무", "기"];
  let gResult; // 변수의 위치

  for (let i = 0; i < gans.length; i++) {
    if (g === i) { // i를 대괄호로 표시했던 점 수정
      gResult = gans[i];
    }
  }
  console.log(`${year}년에 태어났다면 ${gResult}${eResult}년입니다.`);
</script>

for 문 안에서 console.log()를 진행했더니 제대로 출력이 되었었다.
eResult, gResult 의 위치도 for문 밖에서 지정해주었더니 제대로 출력이 되었다...ㅠㅠ
감사합니다... 매니저님ㅠㅠ...

profile
드디어 신발 신은 프론트엔드 개발자

0개의 댓글