JS. prompt를 활용하여 구구단 출력하기!

사용자가 원하는 단을 받아 출력하시오.

조건. 사용자가 원하는 단은 prompt( )를 사용합니다.

{
    let num, result;

    document.querySelector(".btn").addEventListener("click", () => {
        num = prompt("출력할 구구단 숫자를 입력해주세요!!", "2");

        for(let i = 1; i <= 9; i++){
            result = num + "*" + i + "=" + ( num * i ) + "<br>"
            document.querySelector(".result > div").innerHTML += result;
        }
    });
}

---

 

제가 이해하기가 힘드니 한 번 쪼개보겠습니다.!

 

• let num, result;

먼저 num과 result를 선언해줍니다.

 

• document.querySelector(".btn").addEventListener("click", () => {
  num = prompt("출력할 구구단 숫자를 입력해주세요!!", "2");

class="btn"에 클릭을 addEventListener을 해주고 거기에 함수를 넣습니다.

그 함수는 num에다가 prompt를 출력하게끔 하고, 출력할 문자와 기본 값("2")을 설정해줍니다.

 

• for(let i = 1; i <= 9; i++)

자, 사용자가 넣은 숫자에 곱하기 9까지 해줄 것이니 for문을 사용합니다.

for문의 기본형을 살펴보자면, for(초깃값; 조건식; 증감식){} 입니다.

 

• result = num + "*" + i + "=" + ( num * i ) + "
  "

선언한 result를 정의내려줍니다.

 

• document.querySelector(".result > div").innerHTML += result;

class="result"에 값을 넣어주는데, 여기서 중요한 것은 =이 아닌, +=를 해주어야 합니다.

왜냐하면 결과값을 쌓아야 하기 때문이죠!

 

 

이상, 사용자가 원하는 구구단 출력하기 였습니다.

 

 

 

너무 가독성이 떨어지는데, 다음에는 조금 더 잘 써보겠습니다!