JS/JS 수업분

[JS] day09_whileEx

congs 2023. 4. 18. 21:59

 

a의 b제곱 구하기 a :
b :

 
 
<!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>a의 b제곱 구하기</title>
</head>
<body>
    <!-- Math.pow(a,b) -->
    a : <input type="text" id="a"> <br>
    b : <input type="text" id="b"> <br>
    <button type="button"  id="calcBtn";> 제곱 계산</button>
    <h3 id="result">
        <!-- a의 b제곱은 _. 으로 출력
            a =2/ b=3 -> a*a*a -->
    </h3>
    <script>
        // 1. id를 사용하는 방법
        // document.getElementById('calcBtn').addEventListener('click',() => {
        //     let a = document.getElementById('a').value;
        //     let b = document.getElementById('b').value;
        //     a = parseInt(a);
        //     b = parseInt(b);
        //     let cnt=1;
        //     let sum=1;
       
       
        //     while(cnt<=b && !(b<1)){
        //         sum = sum * a;
        //         cnt++;
        //     }
        //     document.getElementById('result').innerText =  `${a}의 ${b}제곱은 ${sum}입니다.`;
        // });

       

        // 2. onclick을 사용하는 방법

        // function calc(){
        //     let a = document.getElementById('a').value;
        //     let b = document.getElementById('b').value;
        //     a = parseInt(a);
        //     b = parseInt(b);
        //     let cnt=0;
        //     let sum=1;
       
       
        //     while(cnt<b && !(b<1)){
        //         sum *= a;
        //         cnt++;
        //     }
        //     document.getElementById('result').innerText =  `${a}의 ${b}제곱은 ${sum}입니다.`;
        // }

       
        //==================================================================================================================


        // 1. id를 사용 + 함수 사용하는 선생님 방법
         document.getElementById('calcBtn').addEventListener('click',() => {
            let a = document.getElementById('a').value;
            let b = document.getElementById('b').value;
            calc(parseInt(a),parseInt(b));
            // 빠른 제곱 구하는 방법
            // console.log(Math.pow(parseInt(a),parseInt(b)));
            // console.log(parseInt(a) ** parseInt(b));
        });

        function calc(a,b){
            let cnt=0;
            let sum=1;
   
            while(cnt<b && !(b<1)){
                sum *= a;
                cnt++;
            }
            document.getElementById('result').innerText =  `${a}${b}제곱은 ${sum}입니다.`;
        }

    </script>

</body>
</html>
 
 

 

 

 

'JS > JS 수업분' 카테고리의 다른 글

[JS] day09_for문  (0) 2023.04.18
[JS] day09_이중반복문  (0) 2023.04.18
[JS] day09_반복문  (0) 2023.04.18
[JS] day09_조건문  (0) 2023.04.18
[JS] day09_Math_random  (0) 2023.04.18