[JS] 반복문

2022. 4. 29. 09:23·Stack/JavaScript

1. while

while(조건){

    조건이 true면 실행

}

 

ex> let j= 0

while(j<10){

    실행할 구문

    j++;

}

 

do {

    조건이 true면 실행

}while(조건:표현식);

 

 

 

2.for

for(초기값; 조건; 증감) {

    실행할 구문

}

 

ex> for(let i=0; i<1000; i++) {

    console.log(i)

}

 

 

 

3. 반복문 빠져나오기

1) break: 완전히 빠져나오기

for(let i=0; i<10; i++ {

    console.log(i);

    if(i===6){

        break;

    }

}

 

2) continue: 다음 반복으로 넘어가기

 


 

01while.html

<!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>
</head>
<body>
    <script>
        let i= 0;
        while(i<10){
            document.write('<h2>금요일입니다.</h2>')
            i++;
        }

        // do {
        //     console.log(i);
        // } while(i<10)
    </script>
</body>
</html>

 

 

 

02for.html

<!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>
</head>
<body>
    <div>
        <ul id="forul">

        </ul>
    </div>
    <script>
        for(let i=1; i<10; i++){
            // console.log(`2 * ${i} = ${2*i}`);
            for(let j=0; j<10; j++){
                console.log(`i는 ${i}이고 j는 ${j}이다.`);
            }
        }

        // 2단~9단까지 구구단을 콘솔에 출력
        let li = "";
        for(let i=2; i<10; i++){
            // console.log(`2 * ${i} = ${2*i}`);
            // console.log(`${i}단입니다.`)
            li=li+`<li><h3>${i}단입니다.</h3><ul>`
            for(let j=1; j<10; j++){
                // console.log(`${i} X ${j} = ${i*j}`);
                li = li+`<li>${i} * ${j} = ${i*j}</li>`;
            }
            li = li+`</ul></li>`;
        }
        document.querySelector('#forul').innerHTML = li;
       
        let str = "";
        for(let i = 0; i<10; i++) {
            str = str + `안녕${i}`;
            console.log(str);
        }
    </script>
</body>
</html>

 

03forStrar.html

<!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>
</head>
<body>
    <div></div>
    <script>
         //별찍기
        let inner = "";
        for(let i=0; i<5; i++) {
            inner = inner + '<p>';
            for(let j=0; j<5-i; j++) {
                inner = inner+ '*';
            }
            inner = inner + '</p>';
        }

        // for(let i=0; i<5; i++) {
        //     inner = inner + '<p>';
        //     for(let j=5; j>i; j--) {
        //         inner = inner+ '*';
        //     }
        //     inner = inner + '</p>';
        // }

        document.querySelector('div').innerHTML = inner;
    </script>
</body>
</html>

 

04break.html

<!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>
</head>
<body>
    <script>
        // for(let i=0; i<10; i++) {
        //     if(i===5){
        //         break;
        //     }
        //     console.log(i);
        // }

        // for(let i=0; i<10; i++) {
        //     if(i===5){
        //         continue;
        //     }
        //     console.log(i);
        // }

        for(let i=0; i<10; i++) {
            if(i%2===1) continue;
            console.log(i);
        }
    </script>
</body>
</html>

 

 

 

05prompt.html

<!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>
</head>
<body>
    <script>
        // let message = 0;
        // do {
        //     message = Number(prompt('100보다 큰 숫자를 입력하세용'));
            
        // } while(message <= 100)

        let num;
        do {
            num = prompt("100을 초과하는 숫자를 입력하세요");
        } while(num <= 100 && num)
    </script>
</body>
</html>

'Stack > JavaScript' 카테고리의 다른 글

[JS] 배열 메소드 / Number 메소드  (0) 2022.05.02
[JS] 배열(Array)  (0) 2022.05.02
[JS] 조건문 2  (0) 2022.04.28
[JS] click 실습  (0) 2022.04.27
[JS] 이벤트  (0) 2022.04.27
'Stack/JavaScript' 카테고리의 다른 글
  • [JS] 배열 메소드 / Number 메소드
  • [JS] 배열(Array)
  • [JS] 조건문 2
  • [JS] click 실습
7ingout
7ingout
  • 7ingout
    Hello, 7ingout world!
    7ingout
  • 전체
    오늘
    어제
    • 분류 전체보기 (205)
      • Project (5)
      • Stack (173)
        • React (40)
        • JavaScript (50)
        • TypeScript (14)
        • HTML (11)
        • CSS (31)
        • Spring (9)
        • PHP (15)
        • SQL (3)
        • Python (0)
      • ETC (9)
      • Design (13)
        • Illustrator (6)
        • Photoshop (7)
      • Articloid (4)
        • 7ingout (4)
  • 공지사항

    • ☻
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.0
7ingout
[JS] 반복문
상단으로

티스토리툴바