03 - 1 if 조건문
if 조건문
→ 불 표현식의 값이 true면 중괄호 안의 문장을 실행하고 false면 문장을 무시한다.
→ if (불 값이 나오는 표현식) {
불 값이 참일 때 실행할 문장 }
<!--if 조건문 사용하기_ 손코딩 3-3-1 -->
<script>
if (273 < 100 ) {
alert ('273 < 100 => true')
}
alert ('종료')
</script>
<!--오전오후 구분하기_ 손코딩 3-1-2 -->
<script>
const date = new Date()
const hour = date.getHours()
if (hour < 12) {
alert('오전입니다.');
}
if (hour >= 12) {
alert('오후입니다.')
}
</script>
if else 조건문
if ( 불 값이 나오는 표현식 ) {
불 값이 참일 때 실행할 문장
} else {
불 값이 거짓일 때 실행할 문장
}
<!--if else 조건문 사용해 현재 시간_ 손코딩 3-1-3 -->
<script>
const date = new Date()
const hour = date.getHours()
if (hour < 12) {
alert('오전입니다.')
} else {
alert('오후입니다.')
}
</script>위와 똑같이 오후 4시에 실행하였기에.. '오후입니다' alert 창이 뜨는 결과를 볼 수 있음 !
중첩 조건문
→ 조건문 안에 조건문을 중첩해 사용하는 것을 중첩 조건문이라고 한다.
<!--중첩 조건문으로 시간 파악 _ 손코딩 3-1-4 -->
<script>
const date = new Date()
const hour = date.getHours()
// 표현식 1
if (hour < 11) {
// 표현식 1이 참이면 실행
alert('아침 먹을 시간입니다.')
} else {
// 표현식 1이 거짓일 때 실행
// 표현식 2
if (hour < 15) {
// 표현식 2가 참일 때 실행
alert('점심 먹을 시간입니다.')
} else {
// 표현식 2가 거짓일 때 실행
alert ('저녁 먹을 시간입니다.')
}
}
</script>
if else if 조건문
→ 겹치지 않는 3가지 이상의 조건으로 나눌 때 사용
→ 중첩 조건문으로 만들었던 예제를 if else if 조건문 형태로 만들기 → 한 쌍의 중괄호 지우기
<!--if else if 조건문으로 시간 파악_손코딩 3-1-5 -->
<script>
const date = new Date()
const hour = date.getHours()
if (hour < 11) {
alert('아침 먹을 시간')
} else if (hour < 15) {
alert('점심 먹을 시간')
} else {
alert('저녁 먹을 시간')
}
</script>
✅기본 숙제
❓중첩 조건문은 2장에서 배운 논리 연산자를 적용해 하나의 if 조건문으로 만들 수 있다.
빈칸에 어떤 논리 연산자가 들어가야 할까?
<!-- 예시 코드 -->
<script>
if ( x > 10 ) {
if ( x < 20 ) {
console.log('조건에 맞습니다.')
}
}
</script>✔️정답
두 조건이 모두 맞았을 때 '조건에 맞습니다.'가 떠야하기 때문에 && 논리 연산자가 들어가야 합니다.
<!DOCTYPE html>
<html>
<head>
<script>
let x = 15
if (x > 10 && x < 20) {
console.log('조건에 맞습니다.')
}
</script>
</head>
</html>
하는 김에 4번도 풀어봅시다..
❓사용자에게 숫자를 입력받아 양수, 0, 음수를 구분하는 프로그램을 만들어보세요.
<!DOCTYPE html>
<html>
<head>
<script>
const a = Number(prompt('숫자를 입력해주세요', ''))
if (a > 0) {
alert('입력한 숫자는 양수')
} else if (a == 0) {
alert('입력한 숫자는 0')
} else {
alert('입력한 숫자는 음수')
}
</script>
</head>
</html>
03 - 2 switch 조건문과 짧은 조건문
switch 조건문
<!-- switch 조건문 사용하기_손코딩 3-2-1 -->
<script>
const input = Number(prompt('숫자를 입력하세요.', '숫자'))
//조건문
switch (input % 2) { // 자료
case 0: // 조건 A
alert('짝수입니다.')
break
case 1: // 조건 B
alert('홀수입니다.')
break
default: // 생략가능
alert('숫자가 아닙니다')
break
}
</script>
→ break : switch 조건문이나 반복문을 빠져나가기 위해 사용하는 키워드
코드를 읽다가 break 키워드를 만나면 break 키워드를 감싼 switch 조건문이나 반복문을 완전히 빠져나간다.
✅ switch 조건문을 if 조건문으로 변환하기
<script>
const date = new Date()
const hour = date.getHours()
//조건문
switch (true) {
case hour < 11 :
// 위의 조건이 참일 경우 실행
alert('아침먹을시간')
break
case hour < 15 :
// 11 이 거짓이고 < 15가 참일 때 실행
alert('점심먹을시간')
break
default :
alert('저녁먹을시간')
break
}
</script>
잘 돌아가긴하는데!
실행했을 때가 오전 12시 30분 경이란 말이죠 ..
새벽입니다 저녁 먹은지 얼마 안 된 시간인데
아침 먹을 시간이라고 판단하기엔 애매하죠
이에 대한 조건이 더 필요하다 생각이 드네요 🤔
조건부 연산자 🌟
→ 불 표현식 ? 참일 때의 결과 : 거짓일 때의 결과
→ 자바스크립트에서 항을 3개 갖는 연산자는 조건부 연산자가 유일하여 삼항 연산자라고 부르기도 한다.
<script>
const input = prompt('숫자를 입력해라', '')
const number = Number(input)
const result = (number >= 0 ) ? '0 이상의 숫자입니다.' : '0보다 작은 숫자입니다.'
alert(result)
</script>
저번 학기 스터디 동안 영화 사이트 만들어 보았었는데
JS를 전혀 이해하지 못하고 만들었다가
이건 뭐 어떻게 쓰는 거지?? 했는데 대박 완전히 알아버렸다 (뭐 완전히 까진 아니더라도 알아버림 !)
이젠 더 잘 활용할 수 있을지도 ?
ㅍㅏ하하 !
짧은 조건문
→ 논리 연산자의 특성을 조건문으로 사용하는 것
✅ 논리합 연산자를 사용한 짧은 조건문
→ 표현식 : true || ooo
→ 논리합 연산자의 좌변이 참이면 우변을 실행하지 않는다.
→ 정리 : 불 표현식 || 불 표현식이 거짓일 때 실행할 문장
✅ 논리곱 연산자를 사용한 짧은 조건문
→ 논리곱 연산자는 양변이 모두 참일 때만 참이기 때문에
false && ooo → 이러한 표현식은 항상 거짓이다.
→ 좌변이 거짓이면 우변을 실행하지 않는다.
→ 결과가 거짓인 불 표현식 && 불 표현식이 참일 때 실행할 문장
짝수와 홀수 구분하기
<!-- 손코딩 3-2-4 -->
<script>
const 입력 = prompt('정수 입력해라', '')
const end = 입력[입력.length - 1]
if (end === "0" ||
end === "2" ||
end === "4" ||
end === "6" ||
end === "8" ||) {
alert(`${입력}은 짝수`)
} else {
alert(`${입력}은 홀수`)
}
</script>
입력할 때 귀찮긴 하다 !@!
<!-- 손코딩 3-2-5 -->
<script>
const 입력 = prompt('정수 입력해라', '')
const num = Number(입력)
if (num % 2 === 0) {
alert(`${입력}은 짝수`)
} else {
alert(`${입력}은 홀수`)
}
</script>
태어난 연도를 입력받아 띠 출력하기
✅ if else if 조건문 사용
<script>
const input = prompt('태어난 해 입력', '')
const year = Number(input)
const e = year % 12
let result
if (e=== 0) {result = '원숭이'}
else if (e === 1) {result = '닭'}
else if (e === 2) {result = '개'}
else if (e === 3) {result = '돼지'}
else if (e === 4) {result = '쥐'}
else if (e === 5) {result = '소'}
else if (e === 6) {result = '호랑이'}
else if (e === 7) {result = '토끼'}
else if (e === 8) {result = '용'}
else if (e === 9) {result = '뱀'}
else if (e === 10) {result = '말'}
else if (e === 11) {result = '양'}
alert(`${year}년에 태어났다면 ${result} 띠입니다`)
</script>
하 .. 나머진 너무 힘든데
차근차근 풀어볼게요 ..
아쉽지만 이만 ~
앞으로도 홧탸 ~
'혼공스(자바스크립트)' 카테고리의 다른 글
| [혼공스] 6주차 _ Chapter 07 ~ 08 (0) | 2024.08.20 |
|---|---|
| [혼공스] 5주차 _ Chapter 06 (0) | 2024.08.13 |
| [혼공스] 4주차 _ Chapter 05 (0) | 2024.07.29 |
| [혼공스] 3주차 _ Chapter 04 (0) | 2024.07.22 |
| [혼공스] 1주차_Chapter 01~02 (0) | 2024.07.08 |
