조건문 - if, switch, 조건부 연산자, 짧은 조건문(221109) - TIL3

Pablaw·2022년 11월 9일
0

TIL

목록 보기
3/20
post-thumbnail

TIL 작성을 시작하며 고민되는 것은 '의미있는 학습 기록을 남기기 위해서 어떻게 효과적으로 정리할 수 있을까'는 것이다.

물론, 성실함의 표현으로 기록을 꾸준히 하는 것도 의미가 있을테지만 가능하다면 후에도 유용하게 찾아볼 수 있도록 기록을 남기는 것도 중요하지 않을까.

가능하다면 '형식적인 기록'보다 '쓰임새가 있는 기록'을 남기기 위해 노력하고자 한다.

if 조건문

if 조건문은 조건에 따라서 코드를 실행하거나 실행하지 않을 때 사용하는 구문이다. 조건은 불 자료형으로 결과 값이 나타나는 것이다.

비교 연산자(>, =, <)와 논리 연산자(&&, ||)를 활용해서 조건을 만들고 이 조건을 사용해 조건 분기를 한다.(참, 거짓에 따라 나눔)

  • 중첩 조건문과 else if 조건문
// 중첩 조건문 

if (불 값 표현식1) {
	if (불 값 표현식2) {
    (표현식1이 참이고) 표현식 2가 참일 경우 실행할 문장
  } else
  	(표현식1이 참이고) 표현식 2가 거짓일 경우 실행할 문장
  }
} else {
	if (불 값 표현식3) {
    (표현식1이 거짓이고) 표현식 3가 참일 경우 실행할 문장
  } else
  	(표현식1이 거짓이고) 표현식 3가 거짓일 경우 실행할 문장
  }
}

// else if 조건문

if (불 값 표현식) {
	실행 문장
} else if (불 값 표현식) {
	실행 문장
} else if (불 값 표현식) {
	실행 문장
} else {
	실행 문장
}

switch 조건문

  • 기본 switch 조건문 구조
switch (자료) {
	 case 값1:
     	break;
     case 값2:
     	break;
     default:
     	break;
}
  • 모든 switch 조건문은 if 문으로 바꿀 수 있다. 반대의 경우에는 if 조건문은 범위를 가지기 때문에 모든 if문을 switch 조건문으로 대체하기는 어렵다.

조건부 연산자 (삼항 연산자)

간단한 조건문을 사용할 때 좋은 표현식으로 직관적으로 이해할 수 있다.

불 표현식 ? 참일 때 결과 값 : 거짓일 때 결과 값

리액트를 사용할 때 state 상태를 변경하는 set을 이용하는 경우 활용되기 때문에 기본 JS를 사용할 때 간단한 조건문은 if 대신 자주 사용해서 익숙해지고자 한다.

짧은 조건문(논리합, 논리곱 연산자 이용)

우선 논리합 연산자, 논리곱 연산자라는 표현이 어색했는데 전자의 경우는 ||를 말하고 후자는 &&을 말한다.

  • 논리합 연산자( || )를 이용한 짧은 조건문
true || console.log('실행이 될까요?')

false || console.log('실행이 될까요?')

첫번째 조건문에서는 연산자 기준 좌항이 참이기 때문에 true가 실행되고 우항은 실행되지 않는다.

두번째 조건문은 좌항이 false이기 때문에 우항에 있는 console.log()표현식이 실행된다.

if 조건문, switch 조건문, 문자열 인덱스

모든 경우에 해당하는 것은 아니지만 입력값을 정해진 일정한 값으로 분류하는 경우에는 위 3가지 방법을 비교해볼 수 있다.

  • 태어난 연도를 숫자로 입력해서 무슨 띠인지 알려주는 조건문을 쓰는 경우

if 조건문이나 switch 조건문을 사용하면

const rawInput = prompt('태어난 해를 입력하세요')
const year = Number(rawInput)
const e = year % 12

if (e === 0) {
	result = '원숭이'
} else if (e === 1) {
	result = '닭'
} else if (e === 2) {
	result = '개'
} else if (e === 3) {
	result = '돼지'
} ...
...
...
alert(`${year}년에 태어났다면 ${result} 띠입니다.`)

이런식으로 길어지는 것이 불가피 하다.
하지만 문자열의 경우는 split() 메소드를 사용하여 배열로 이용하게 되면

const rawInput = prompt('태어난 해를 입력하세요')
const year = Number(rawInput)
const tti = '원숭이,닭,개,돼지,쥐,소,호랑이,토끼,용,뱀,말,양'.split(',')

alert(`${year}년에 태어났다면 ${tti[year %12]} 띠입니다`)

코드의 양을 획기적으로 줄일 수 있다.

실제로 VScode 비슷한 함수를 구현할 때
if 조건문은 44줄, switch 문은 65줄, 문자열 배열 인덱스 사용은 5줄로 큰차이가 있었다.


책에서는 이런 내용도 소개한다. 프로그래밍 초보자들이 코드를 작성할 때 '코드가 이렇게 지저분하게 만들어질리 없어'하는 생각에 잘 작성하고 있더라도 포기하는 경우가 많다는 것이다.

동시에 저자가 강조하는 것은 초보자 단계에서 우선 중요한 것은 무언가를 만드는 것이라는 점이다.

비효율적인 코드도 직접 작성을 해볼 때 비로소 효율적인 코드도 기억에 더 잘 남을 수 있다는 말을 새기며 너무 낙담하지 않고 노력해야겠다.

profile
반갑습니다, 프론트엔드 개발자를 꿈꾸고 있습니다 ! https://pablaw.github.io/profileLink/

0개의 댓글