javascript

01. if문

if 문은 조건을 평가하고, 조건이 true이면 특정한 코드 블록을 실행하는 제어문입니다.

 {
    // true : true, "문자열", 1, 2, "1", "2", [](빈 배열), {}(빈 객체)
    // false : 0, false, null, undefined, ""(빈 문자열)
    
    if(0){
        document.write("실행되었습니다.(true)");
    } else {
        document.write("실행되었습니다.(false)");
    }
}

예시에서 if(0)이라는 조건을 평가하고 있습니다. 여기서 0은 false로 간주되는 값입니다. 따라서 조건이 false이므로 else 블록 내의 코드가 실행됩니다.

02. 다중 if문

if, else if, else 문은 조건에 따라 다른 동작을 수행하도록 프로그램 흐름을 제어하는 데 사용됩니다.

 {
    const num = 100;

    if(num == 90){
        document.write("실행되었습니다.(num = 90)");
    } else if(num == 95){
        document.write("실행되었습니다.(num = 95)");
    } else if(num == 100){
        document.write("실행되었습니다.(num = 100)");
    } else if(num == 105){
        document.write("실행되었습니다.(num = 105)");
    } else {
        document.write("실행되었습니다.");
    }
}

주어진 코드는 if, else if, 그리고 else 문을 사용하여 여러 조건을 비교하고, 조건에 해당하는 경우에 해당하는 메시지를 출력하는 예제입니다.

03. 중첩 if문

 {
    const num = 100;

    if(num == 100){
        document.write("실행되었습니다.1");
        if(num == 100){
            document.write("실행되었습니다.2");
            if(num == 100){
                document.write("실행되었습니다.3");
            }
        }
    } else {
        document.write("실행되었습니다.4")
    }
}

주어진 코드는 중첩된 if 문을 사용하여 여러 조건을 검사하고, 각 조건이 충족될 때마다 다른 메시지를 출력하는 예제입니다.

04. if문 생략 & 삼항 연산자

if 문과 삼항 연산자를 사용하여 조건에 따라 다른 코드를 실행하는 방법을 보여주고, {}를 사용하지 않고도 간단한 조건에 따른 코드 실행을 표현하는 다양한 방법을 보여줍니다.

 {
    const num = 100;

    // if(num == 100){
    //     document.write("실행되었습니다.(true)")
    // }

    // 에서 {}생략

    if(num == 100) document.write("실행되었습니다.(true)");


    // if(num == 100){
    //     document.write("실행되었습니다.(true)");
    // } else {
    //     document.write("실행되었습니다.(false)");
    // }

    // 에서 {} {} 생략 - {} {} 생략으로 약식표현 할 수 있지만 가독성 x 자바에서는 가끔 사용합니다.

    if(num == 100) document.write("실행되었습니다.(true)")
    else document.write("실행되었습니다.(false)");
    
    // 삼항 연산자(조건식 연산자) vv 요즘 제일 많이 쓰임! 특히 리액트
    // 쓸 것만 읽어서 속도가 더 빠름!
 
    (num == 100) ? document.write("true") : document.write("false")
}

if 문 (중괄호 생략) : 첫 번째 코드 블록에서 if (num == 100)은 num 변수가 100과 같은지 확인하는 조건입니다.
if 문과 else 문 (중괄호 생략) : 두 번째 코드 블록에서는 if (num == 100) 조건에 따라 실행될 코드와 else 조건에 따라 실행될 코드를 중괄호 {} 없이 나열하고 있습니다.
삼항 연산자 (조건식 연산자) : 세 번째 코드 블록에서 삼항 연산자를 사용하여 조건에 따라 다른 값을 반환합니다. num 변수가 100과 같으면 "true"를 출력하고, 그렇지 않으면 "false"를 출력합니다.
삼항 연산자는 조건에 따라 다른 값을 반환하고 사용할 때 코드를 간결하게 유지할 수 있으며, 주로 리액트와 같은 JavaScript 기반 프론트엔드 라이브러리나 프레임워크에서 많이 활용됩니다.

05. swhich문

switch 문을 사용하여 여러 다른 경우(case)에 따라 다른 코드 블록을 실행하는 예제입니다.

 {
    const num = 100;

    switch(num){
        case 90:
            document.write("실행되었습니다.(90)");
            break; //안하면 무한으로 감
        case 95:
            document.write("실행되었습니다.(95)");
            break;  
        case 100:
            document.write("실행되었습니다.(100)");
            break;  
        case 105:
            document.write("실행되었습니다.(105)");
            break; 
        default:
            document.write("실행되었습니다.");     
    }
}

case 문에서 각각의 경우에 대한 조건을 제공합니다. case에서의 값이 num 변수와 동일할 경우 실행되고 코드 블록은 break; 문을 사용하여 종료됩니다. break;가 없으면 해당 case에서 코드 실행을 멈추지 않고 다음 case로 넘어가게 됩니다.
default: 어떤 case에도 해당하지 않는 경우에 실행됩니다. 만약 break;가 없었다면 case 105:까지 실행되어 "실행되었습니다.(105)"가 출력되었을 것입니다.

06. while문

while 반복문은 특정 조건이 true인 동안 반복적으로 코드 블록을 실행합니다.

 {
    let num = 1;
    while(num <= 10){
        document.write(num);
        num++;
    }
}

while 반복문은 조건이 true인 동안 코드 블록을 반복 실행합니다. 이 예제에서는 num이 10 이하일 때만 반복문이 실행됩니다.
만약 조건이 항상 true로 유지된다면 무한 루프에 빠질 수 있으니 주의하여야합니다.

07. do while문

do...while 반복문을 사용하여 1부터 10까지의 숫자를 출력하는 예제입니다. do...while 반복문은 while 반복문과 유사하지만, 조건을 먼저 확인하는 대신 먼저 코드 블록을 실행하고 나중에 조건을 확인합니다. 따라서 최소한 한 번은 코드 블록이 실행되며, 조건이 true일 경우 추가로 반복됩니다.

 {
    let num = 1;
    do {
        document.write(num);
        num++
    } while(num <= 10);
}

while 뒤에 세미콜론(;)이 있는데, 이는 do...while 반복문의 특징입니다. 조건을 나타내는 부분을 세미콜론(;)으로 구분하며, 이렇게 하면 코드 블록을 실행한 후에 조건을 확인합니다.

08. for문

for 반복문을 사용하여 숫자와 배열을 반복적으로 출력하는 예제입니다. for 반복문은 특정 조건이 충족될 때까지 코드를 반복 실행하는데 사용됩니다.

 {
    for(let i=1; i <= 10; i++){      // i가 10 이하인 동안 반복
        document.write(i);
    }

    const num = [10,20,30,40,50,60,70,80,90];

    for(let i = 0; i < num.length; i++){     // i가 0부터 시작해서 배열의 길이(num.length)보다 작을 때까지 반복
        document.write(num[i]);
    }
}

대부분의 경우 for 반복문에서 배열의 요소를 접근하고 출력할 때 i와 같은 변수는 배열의 인덱스 값을 나타냅니다. 따라서 배열의 요소를 추출하기 위해서는 num[i]로 사용해야합니다.

09. break문

특정 조건에서 반복을 중단하는 break 문을 사용하는 예제입니다.

 {
    // 1부터 10까지
    for(let i = 1; i <= 10; i++){
        document.write(i);
    }

    // 5 전까지만 출력 됨
    for(let i = 1; i <= 10; i++){
        if(i == 5){
            break;
        }
        document.write(i);
    }
}

i가 5일 때, break;가 실행되어 두 번째 반복문이 중단되고, 이후의 숫자는 출력되지 않습니다.

10. continue문

for 반복문을 사용하여 1부터 10까지의 숫자를 출력하는데, 특정 조건에서 반복을 건너뛰는 continue 문을 사용하는 예제입니다.

 {
    for(let i = 1; i <= 10; i++){
        if(i == 5){
            continue;
        }
        document.write(i);
    }
}

if (i == 5) : 조건은 현재의 i 값이 5와 같을 때 실행됩니다.
continue; 문은 if 조건이 충족될 때 실행됩니다. continue 문은 현재 반복을 중지하고 다음 반복으로 넘어가는 역할을 합니다. 따라서 i가 5일 때, 해당 반복에서는 continue가 실행되어 반복이 중지되고 다음 반복이 시작됩니다.