1차 공부/TIL

221108 조건문(3장)

공대탈출 2022. 11. 8. 20:05

0123


오늘은 처음으로 기술매니저님이 오시기 전에 스터디 팀원분께 질문을 했었다.

그 분께서 코드를 보고 문제점을 말씀해 주시기도 하였고, 코드를 보시는 동안 다시 생각해서 스스로 문제점을 알아내기도 하였다.

나도 항해 주특기가 시작 되기 전 다른 분들께 도움을 드릴 수 있는 사람이 되었으면 좋겠다고 생각하였다.


&& - 논리곱 연산자 : 어느 한 쪽이 false이면 결과는 false

|| - 논리합 연산자 : 어느 한 쪽이 true이면 결과는 true

=== - 값, 자료형 둘 다 같은지 비교

== - 둘의 값이 같은지 비교


3장 - 조건문

if 조건문

<script>
	if (273<100) {
    	alert('273<100 => true')
        } 
        alert('종료')
</script>

간단하게 if 옆 소괄호 안의 값이 true이면 중괄호 안의 명령을 수행하고, false이면 무시하는 조건문이다.

 

if else 조건문

<script>
	if (273<100) {
    	alert('273<100 => true')
        } else{
        	alert('273<100 => false')
          }
        alert('종료')
</script>

위 if조건문과 다르게 false이면 else 조건문의 명령을 실행한다.

if조건문을 두번 써야하는 수고를 줄일 수 있다.

 

중첩 조건문

<script>
const date = new Date()
const hour = date.getHour()
	if (hour<11){
    	alert('아침')
        } else{
        	if (hour<15){
        		alert('점심')
			} else {
            	alert('저녁')
            	}
</script>

if 속에서 한번 더 조건을 나누어야 할 때에 사용한다.

이를 if else if 조건문으로 변환하면 아래와 같이 비교적 간단해 진다.

<script>
	if (hour<11){
    	alert('아침')
	} else if (hour<15){
    	alert('점심')
	} else {
    	alert('저녁')
	}
</script>

때에 따라 어떤 조건문이 코드의 간결화에 더 좋은지 판별하여 사용해야 할 것 같다.

 


Switch 조건문

<script>
	const input = Number(prompt('숫자를 입력하세요','')
	Switch (input%2){
    	case 0 :
        	alert('짝수')
		break
		case 1 :
        	alert('홀수')
        	break
		default
        	alert('숫자가 아닙니다.')
            break
	}
</script>

위와 같이 Switch의 소괄호 안에 자료를 입력하고 그 자료의 결과값을 case 오른쪽의 조건과 비교하여

일치 할 경우 case 내부의 명령을 차례대로 수행한다. 또한 Switch내부의 break문의 차례에는

Switch외부로 이동하게 한다.

 

조건부 연산자(a.k.a. 삼항 연산자)

형식은 다음과 같다 //  불 표현식 ? 참일때의 결과 : 거짓일때의 결과

예를 들자면

<script>
const input = prompt('숫자를 입력하세요','')
const number = Number(input)
const result = (number>=0) ? '0 이상의 숫자입니다.' : '0보다 작은 숫자입니다.'
alert (result)
</script>

여기서 3을 입력한다면 :의 왼쪽에 위치한 '0이상의 숫자입니다'가 출력된다.

 

다음으로 손코딩을 해 본 두가지 예시들을 두 분류로 나누어 비교해 보겠다.

<script>
const 입력 = prompt('정수를 입력하세요')
const 끝자리 = 입력[입력.length -1]
if (끝자리 === "0" ||
	끝자리 === "2" ||
	끝자리 === "4" ||
	끝자리 === "6" ||
	끝자리 === "8" ||) {
    alert(`${입력}은 짝수입니다.`)
    }else{
    	alert(`${입력}은 홀수입니다.`)
    }
</script>
const 입력 = prompt('정수를 입력하세요','')
const 숫자 = Number(입력)
if (숫자%2 ==0){
	alert(`${입력}은 짝수입니다.`)
    } else{
    	alert(`${입력}은 홀수입니다.`)
    	}

위는 비교값인 끝자리를 문자열로, 밑은 비교값인 숫자를 숫자열로 받는다.

컴퓨터는 문자열의 비교보다 숫자열의 비교가 더 용이하므로 숫자열을 사용한 아래의 코드가 더 좋다고 볼 수 있다.

 

또한 보는 입장에서도 아래의 코드가 더 이해하기 쉽다고 생각한다.

 

두번째

if (score === 4.5){
	alert('a')
} else if (4.2<=score && score <4.5){
	alert('b')
} else (3.5 <= score && score < 4.2){
	alert('c')
}
if (score === 4.5){
	alert('a')
} else if (4.2<=score){
	alert('b')
} else (3.5 <= score){
	alert('c')
}

논리곱 연산자가 없어져 아래 코드가 훨씬 가독성이 좋음을 알 수 있다.

if 조건문은 위에서부터 아래로 내려가며 코드를 실행하는데 else문은 이전 조건이 이미 맞지 않을 때 사용되는 코드이다.

따라서 앞에서 제외했던 if문의 조건을 굳이 다시 검사 할 필요는 없기 때문에 아래의 코드가 가독성과 효율측인 면에서 더 좋은 코드라고 할 수 있다.


틀린문제


틀렸던 코드

<script>
const rawInput= prompt('태어난 해를 입력해주세요.','')
const year = Number(rawInput)

let 간
//틀린부분//
const gan = ['갑','을','병','정','무','기','경','신','임','계'].split(',')
const e = year[year.length -1] -1  //틀린곳//
간 = gan[e]
//틀린부분 끝//

let 띠
//틀린부분//
const tti = ['자','축','인','묘','진','사','오','미','신','유','술','해'].split(',')
const d = year[year%12]        //틀린곳//
띠 = tti[d]
//틀린부분 끝//

alert(`${year}년은 ${간}${띠} 년입니다.`)
</script>

year는 위에서 정수로 선언하는Number을 거쳐서 배열의 형식이 아니다.

따라서 year의 뒤에 [ ]가 붙는다던지, year,length를 한다던지의 인덱스형 코드가 작동하지 않기 때문에 틀린 결과가 도출되었었다.


고친 코드

<script>
const raw Input= prompt('태어난 해를 입력해주세요.','')
const year = Number(rawInput)

let 간
//고친부분//
const gan = '갑,을,병,정,무,기,경,신,임,계'.split(',')
간 = gan[year%10]
//고친부분 끝//

let 띠
//고친부분//
const tti = '자,축,인,묘,진,사,오,미,신,유,술,해'.split(',')
띠 = tti[year%12]
//고친부분 끝//

alert(`${year}년은 ${간}${띠} 년입니다.`)
</script>

[ ]내부의 year에 관한 것을 배열(인덱스)에 사용하는 코드가 아닌 숫자에 사용하는 %를 사용하였기에,

코드가 문제없이 정상 작동하였다.

 

따라서, 내가 하고자하는 명령을 적을 때에 명령이, 할당되는 상수 혹은 변수에, 적절한 것인지를 알아야 한다는 것을 알게 되었다.


물어 볼 것

p.132
질문1) getMonth() +1 --> 'getMonth 메소드는 값을 0~11로 받기 때문에...'

왜?? 공식문서를 보니 getDate는 값을 1~31로 받던데 왜 getMonth는 0~11로 받는지?

인덱스 형식이라? 그럼 Date는?

 

질문2) 자바스크립트 mdn에서 date()생성자에 관해 보았는데

'JavaScript Date 객체는 시간의 한 점을 플랫폼에 종속되지 않는 형태로 나타냅니다.' 이게 무슨 뜻인지?

 

질문3) 아래와 같은 논리합,곱 연산자를 이용한 짧은 조건문을 실제로 사용하는가?

true || console.log('실행') false && console.log('실행')

'1차 공부 > TIL' 카테고리의 다른 글

221118 til  (0) 2022.11.18
221112 객체(6장)  (0) 2022.11.12
221111 함수 (5장)  (2) 2022.11.11
221110 반복문(4장)  (0) 2022.11.10
221107 자바스크립트 개요 및 자료와 변수(1~2장)  (0) 2022.11.07