[FrontEnd2] JS 연습문제 풀이 (제어문, confirm)

SMALL

안녕하세요:) 보라해바라기입니다~

 

오늘은 내용이 좀 많아서 글을 나누어 올리려고 합니다 ㅎㅎ

 

첫번째 내용은 제어문과 confirm입니다!

 


1. 제어문

(1) 두 정수 비교하여 출력

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=d, initial-scale=1.0">
    <title>Document</title>
    <script>
        var num1 = prompt("첫 번째 변수를 입력하시오.")
        num1 = Number(num1)

        var num2 = prompt ("두 번째 변수를 입력하시오.")
        num2 = Number(num2)

        if(num1 < num2) {
            document.write(num1 + "이 " + num2 + "보다 작습니다.", "<br>")
        }
        else if(num1 == num2) {
            document.write(num1 + "이 " + num2 + "와 같습니다.", "<br>")
        }
        if(num1 > num2) {
            document.write(num1 + "이 " + num2 + "보다 큽니다.", "<br>")
        }

    </script>
</head>
<body>
    
</body>
</html>

 

(2) 조건문으로 성인, 미성년자 판별

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=d, initial-scale=1.0">
    <title>Document</title>
    <script>
        var age = prompt("나이를 입력하세요.")
        age = parseInt(age)

        if (age >=20) {
            document.write("성인", "<br>")
        }
        else{
            document.write("미성년자", "<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

 

(3) 정수를 보고 양수, 0, 음수 판별

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=d, initial-scale=1.0">
    <title>Document</title>
    <script>
        var num = prompt("정수를 입력하세요.")
        num = parseInt(num)

        if (num>0) {
            document.write("양수", "<br>")
        }
        else if (num==0) {
            document.write("0", "<br>")
        }
        else {
            document.write("음수", "<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

 

(4) 컴공과 140학점 이상을 판별하여 졸업가능 여부 알려주기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=d, initial-scale=1.0">
    <title>Document</title>
    <script>
        var major = prompt("전공을 입력하세요.")
        var point = prompt("이수학점을 입력하세요.")
        point = parseInt(point)

        if (major=="컴퓨터공학"){
            if (point>=140){
                document.write(major + "과 졸업 대상입니다.", "<br>")
            }
            else {
                document.write(major + "과 이수 학점 부족!", "<br>")
            }
        }
        else{
            document.write("컴퓨터공학과가 아닙니다.")
        }
    </script>
</head>
<body>
    
</body>
</html>

컴퓨터 공학과일 경우
컴퓨터 공학과가 아닐 경우

 

(5) 성별, 키, 체중을 입력받아 표준체중을 계산하여 증감량 여부 알려주기

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=d, initial-scale=1.0">
    <title>Document</title>
    <script>
        var gender = prompt("성별을 입력하세요.")
        
        var height = prompt("키를 입력하세요.")
        height = parseFloat(height)
        
        var weight = prompt("체중을 입력하세요.")
        weight = parseFloat(weight)
        
        var standard = 0
        standard = parseFloat(standard)

        if (gender == "남성"){
            standard = (height-100)*0.9
            if (weight>standard){
                document.write((weight-standard) + "kg 만큼 더 감량하세요!", "<br>")
            }
            else if (weight==standard){
                document.write("표준 체중입니다.", "<br>")
            }
            if (weight<standard){
                document.write((standard-weight) + "kg 만큼 더 증량하세요!", "<br>")
            }
        }
        else if (gender == "여성"){
            standard = (height-100)*0.8
            if (weight>standard){
                document.write((weight-standard) + "kg 만큼 더 감량하세요!", "<br>")
            }
            else if (weight==standard){
                document.write("표준 체중입니다.", "<br>")
            }
            if (weight<standard){
                document.write((standard-weight) + "kg 만큼 더 증량하세요!", "<br>")
            }
        }
        else{
            document.write("성별을 정확히 다시 입력해주세요.", "<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

남성일 경우
여성일 경우

 


2. 제어문 + confirm

(1) 확인버튼 눌렀을 때, "탕수육 드세요" 출력

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var question = confirm("중국음식을 드시겠습니까?")

        if (question == true){
            document.write("탕수육 드세요~^^", "<br>")
        }
        else {
            document.write("<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

 

(2) 가수입니까? (확인버튼 -> 당신은 IU!   취소버튼 -> 당신은 김태희!)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var question = confirm("당신은 가수입니까?")

        if (question == true){
            document.write("당신은 IU!", "<br>")
        }
        else{
            document.write("당신은 김태희!", "<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

 

(3) 회원가입 (확인 -> 아이디, 비밀번호 입력. 단, 두 값이 같으면 안됨.   취소-> 종료!)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var question = confirm("회원가입을 하시겠습니까?")

        if (question == true){
            var id = prompt("아이디를 입력하세요.")
            var pw = prompt("비밀번호를 입력하세요.")
            if (id == pw) {
                document.write("아이디랑 비밀번호가 같으면 안됩니다.", "<br>")
            }
            else {
                document.write("ID: " + id, "<br>")
                document.write("PW: " + pw, "<br>")
            }
        }
        else {
            document.write("종료!", "<br>")
        }
    </script>
</head>
<body>
    
</body>
</html>

아이디와 비밀번호가 같은 경우
아이디와 비밀번호가 다른 경우
취소

 

(4) 회원탈퇴 (확인 -> 아이디, 비밀번호 입력. 두 값이 같으면 탈퇴.   취소->종료!)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var id = "aaa111"
        var pw = "bbb222"

        var question = confirm("회원탈퇴를 하시겠습니까? (원래 id : aaa111,  pw:bbb222)")

        if (question == true){
            var newid = prompt("아이디를 입력하세요.")
            var newpw = prompt("비밀번호를 입력하세요.")

            if (id == newid){
                if (pw == newpw){
                    document.write("탈퇴 성공!", "<br>")
                }
                else{
                    document.write("잘못된 비밀번호가 입력되었습니다.", "<br>")
                }
            }
            else {
                if (pw == newpw){
                    document.write("잘못된 아이디가 입력되었습니다.", "<br>")
                }
                else{
                    document.write("잘못된 아이디, 비밀번호가 입력되었습니다.", "<br>")
                }
            }
        }
        else {
            document.write("종료!", "<br>")
        }

    </script>
</head>
<body>
    
</body>
</html>

탈퇴성공
잘못된 아이디
잘못된 비밀번호
잘못된 아이디와 비밀번호
취소

 

 

(5) 값 증가 및 출력 (확인-> 값 증가   취소-> 이때까지 증가한 최종 값을 출력)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var plus = confirm("값 증가")
        var i = 0

        while (plus == true) {
            i++
            plus = confirm("값 증가")
        }

        document.write("증가된 값: " + i, "<br>")
    </script>
</head>
<body>
    
</body>
</html>

확인 버튼 4번 누름

 

728x90

댓글