Stack/JavaScript

[JS] 반복문

7ingout 2022. 4. 29. 09:23

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>