본문 바로가기
혼공학습단 11기(完)

[혼공스] 03 - 1 정리

by jaeheon0520 2024. 1. 11.

 

오늘은 03 - 1장의 내용을 정리해 보자.

 

03 - 1장의 제목은 'if 조건문'으로, 자바스크립트에서 가장 일반적인 조건문인 if 조건문에 대해 설명하고 있다.

 

쉬우면서도 많이 사용되는 구문이니 예제를 잘 정리해야겠다.

 

그럼 정리 시작!

 

조건 분기?

조건문을 사용하면 조건에 따라 코드가 실행될 수도 있고 실행되지 않을 수도 있다. 이처럼 코드가 실행되는 흐름을 변경하는 것을 조건 분기라고 부른다.

 

if 조건문

조건에 따라 코드를 실행하거나 실행하지 않도록 하기 위해 사용하는 구문

else 구문

if 조건문 뒤에 사용하며, if 조건문이 거짓일 때 사용

중첩 조건문

조건문을 중첩해서 사용하는 경우

if else if 조건문

중첩 조건문에서 중괄호를 생략한 형태로, 겹치지 않는 3가지 이상의 조건으로 나눌때 사용

<script>
 const date = new Date()
 const hour = date.getHours()
 
 if (hour < 11) {
  alert('아침 먹을 시간입니다')
 }
 else if (hour < 15) {
  alert('점심 먹을 시간입니다')
 }
 else {
  alert('저녁 먹을 시간입니다')
 }
<script>

 

조건문을 활용한 예제이다. if else if 조건문과 Date 객체를 생성한 부분을 익혀두면 좋을 것 같다.

 

연습문제 4번

사용자에게 숫자를 입력받아 양수, 0, 음수를 구분하는 프로그램을 만들어보세요.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <script>
        const a = Number(prompt('숫자를 입력해주세요.', ''))

        let s = ''

        if (a > 0)
            s = '양수'
        else if (a === 0)
            s = '0'
        else
            s = '음수'

        alert(`입력한 숫자는 ${s}입니다.`)
    </script>
</head>
<body>
</body>
</html>

 

연습문제 5번

사용자에게 숫자를 입력받아 홀수와 짝수를 구분하는 프로그램을 만들어보세요.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <script>
        const a = Number(prompt('숫자를 입력해주세요.', ''))

        let ret = '홀수'

        if (a === 0)
            ret = 0
        else if (a % 2 === 0)
            ret = '짝수'
       
        alert(`입력한 숫자는 ${ret}입니다.`)
    </script>
</head>
<body>
</body>
</html>

 

연습문제 6번

현재가 몇 월인지 입력받고, 계절을 구분하는 프로그램을 만들어보세요.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <script>
        const a = Number(prompt('월을 입력해주세요.'))

        let month = ''

        if (a >= 3 && a <= 5)
            month = ''
        else if (a >= 6 && a <= 8)
            month = '여름'
        else if (a >= 9 && a <= 11)
            month = '가을'
        else
            month = '겨울'
       
        alert(`${month}입니다.`)
    </script>
</head>
<body>
</body>
</html>

 

현재가 몇 월인지 확인하고, 계절을 구분하는 프로그램을 만들어보세요.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Document</title>
    <script>
        const date = new Date()
        const a = date.getMonth() + 1

        let month = ''

        if (a >= 3 && a <= 5)
            month = ''
        else if (a >= 6 && a <= 8)
            month = '여름'
        else if (a >= 9 && a <= 11)
            month = '가을'
        else
            month = '겨울'
       
        alert(`${month}입니다.`)
    </script>
</head>
<body>
</body>
</html>

 

6번 두번째 프로그램은 사용자에게 입력받은 월이 아니라 프로그램을 실행한 시점 기준으로 계절을 판단하는 프로그램으로 만들어보았다. Date 객체를 생성해서 getMonth() 메소드로 현재 몇월인지 저장하였다.

 

03 - 1장은 여기서 마무리된다.

 

연습문제를 통해 상수, 변수의 사용법을 복습하고, ``(백틱)과 date 객체를 사용하는 법을 익혀보았다.

이전에는 prompt로 입력을 받고, Number()로 자료형 변환을 해주었는데,

Number(prompt())의 형태로 한번에 처리한 것이 인상적이었다. 

 

다음에는 03 - 2 장의 내용을 정리해보자!

 

오늘 하루도 쌓였다.

'혼공학습단 11기(完)' 카테고리의 다른 글

[혼공스] 2주차 미션  (0) 2024.01.12
[혼공스] 03 - 2 정리  (0) 2024.01.12
[혼공스] 02 - 3장 연습문제 풀이  (1) 2024.01.10
[혼공스] 02 - 3 정리  (1) 2024.01.09
[혼공스] 02 - 2 정리  (1) 2024.01.08