JavaScript 입문과 웹 UI개발(10)-if/else,function 관련 문제

2022. 10. 2. 21:10애플코딩 javascript 강의

반응형

Q1. 철수는 369게임을 더럽게 못합니다. 

 

실제 369게임 말고 약간 쉽게 각색해서 

'3의 배수에서' 박수를 치면 되는 게임을 하고 있습니다. 

 

근데 철수는 바보라 숫자를 하나 주었을 때 이 숫자가 3의 배수인지 아닌지 파악하기 넘나 힘든 관계로

프로그래밍으로 이 문제를 해결하려고 합니다.

어떤 숫자를 함수 안에 집어넣으면 박수를 쳐야할 지 말아야할 지 판단해주는 함수를 만들려고 하는데

어떻게 함수를 만들어야할까요?

 

function 삼육구게임() {
  //빨리 이 함수를 디자인해봅시다. 
}

 

실행결과 예시 :

삼육구게임(6); 실행하면 3의 배수니까 콘솔창에 '박수'라는 글자가 떠야합니다.

삼육구게임(12); 실행하면 3의 배수니까 콘솔창에 '박수'라는 글자가 떠야합니다.

삼육구게임(11); 실행하면 3의 배수 아니니까 콘솔창에 '통과'라는 글자가 떠야합니다.

 

힌트 : 

자바스크립트엔 % 나머지 연산자가 있긴 합니다

 

<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>문제풀이</title>

    <!--제이쿼리-->
    <script
    src="https://code.jquery.com/jquery-3.6.1.min.js"
    integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="
    crossorigin="anonymous"></script>
</head>
<body>
3의 배수를 입력하면 콘솔창에 박수 <br>
<input type="text" id="three"> <button type="button" id="go">가자</button>

<script>
    $("#go").on('click', function(){
        삼육구게임(Number($('#three').val()));
    })


    function 삼육구게임(aa){
        if(aa%3==0){
            alert('3의 배수임');
            console.log("박수");
        }else if(aa<0){
            alert('0이상의 숫자를 입력하시오');
        }else if(aa>=0){
            alert('3의 배수 아님');
            console.log("통과");
        }else{
            alert('숫자를 입력해주세요');
        }
    }

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

 

 

 

Q2.  369게임 업그레이드 버전

 

369게임 업그레이드 버전은 3의 배수에서 박수를 치는건 맞지만

9의 배수에서는 박수를 두번 쳐야합니다.

철수는 역시나 이것도 프로그래밍으로 이 문제를 해결하려고 합니다.

아까 만들었던 369게임() 함수를 어떻게 고치면 될까요? 

 

참고) 함수이름 작명시 맨 처음 단어는 숫자를 사용하시면 안됩니다.

참고2) 페이지 내의 다른 곳에서 자바스크립트 문법 에러가 뜨는 경우 다른 코드도 실행이 제대로 되지 않습니다.

콘솔창에 에러가 없는지 한번 확인해보십시오. 

 

 

 

function 삼육구게임() {
  //빨리 이 함수를 디자인해봅시다. 
}

실행결과 예시 :

삼육구게임(6); 실행하면 콘솔창에 '박수'라는 글자가 떠야합니다.

삼육구게임(9); 실행하면 콘솔창에 '박수x2'라는 글자가 떠야합니다.

삼육구게임(11); 실행하면 콘솔창에 '통과'라는 글자가 떠야합니다.

 

<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>문제풀이</title>

    <!--제이쿼리-->
    <script
    src="https://code.jquery.com/jquery-3.6.1.min.js"
    integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="
    crossorigin="anonymous"></script>
</head>
<body>
3의 배수를 입력하면 콘솔창에 박수 <br>
<input type="text" id="three"> <button type="button" id="go">가자</button>

<script>
    $("#go").on('click', function(){
        삼육구게임(Number($('#three').val()));
    })


    function 삼육구게임(aa){
        if(aa%9==0){
            alert('9의 배수임');
            console.log("박수 박수");
        }else if(aa%3==0){
            alert('3의 배수임');
            console.log("박수");
        }else if(aa<0){
            alert('0이상의 숫자를 입력하시오');
        }else if(aa>=0){
            alert('9의 배수도 3의 배수도 아님');
             console.log("통과");
        }else{
            alert('숫자를 입력해주세요');
        }
    }

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

 

 

Q3) 시험 점수를 입력하면 합격인 불합격인지

 

공인중개사 1차 시험은 개론, 민법 2개 과목이 있습니다.

과목마다 100점 만점이지만 두 과목 합해서 120점 이상이면 합격시켜줍니다. 

다만 한 과목이 40점 미만이면 과락으로 불합격됩니다.  

과목 점수 2개를 파라미터로 입력하면 합격인지 불합격인지 여부를 콘솔창에 출력하는 함수를 만들어보십시오. 

 

function 합격했냐(){
  //코드 짜면 됩니다
}

실행결과 예시 :

합격했냐(70, 70); 실행시 총점 120이상이니 콘솔창에 '합격'이 출력되어야합니다.

합격했냐(30, 100); 실행시 하나 과락이니 콘솔창에 '불합격'이 출력되어야합니다.

합격했냐(50, 50); 실행시 총점 120미만이니 콘솔창에 '불합격'이 출력되어야합니다.

 

<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>문제풀이</title>

    <!--제이쿼리-->
    <script
    src="https://code.jquery.com/jquery-3.6.1.min.js"
    integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="
    crossorigin="anonymous"></script>
</head>
<body>
점수를 입력하세요 <br>
<input type="text" id="test1"><br>
<input type="text" id="test2"><br>
<button type="button" id="go">결과보기</button>

<script>
 $('#go').on('click', function(){
    
        합격했냐(Number($('#test1').val()), Number($('#test2').val()) );
 })

 function 합격했냐(aa, bb){
    
    if(aa>=40 && bb>=40 && (aa+bb)>=120){
        alert('합격');
    }else{
        alert('불합격');
    }
 }

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

강의 출처: JavaScript 입문과 웹 UI개발

https://codingapple.com/

 

코딩애플 온라인 강좌 - 개발자도 단기완성!

단연 NO1 강사님의 NO.1 강의 역시나 명강입니다. IT 업계의 대치동 NO1. 강사같은 엄청난 강의력. 코딩애플님의 강의는, 엄청나게 기초적인 것부터 가르치는 듯 보이지만, 실제로 다루는 깊이는 절

codingapple.com

 

반응형