본문 바로가기
JAVASCRIPT

데이터 제어하기

by dongjin6539 2023. 2. 28.
728x90
반응형

데이터 제어하기

자바스크립트에서 데이터를 제어하는 종류에 if문, if문 생략, 삼항 연산자, 다중 if문, 중첩 if문, switch문, while문, do while문, for문, 중첩 for문, continue문, break문이 있습니다.
이제 순서대로 알아보겠습니다.

 

if문
  • 조건문은 프로그래밍에서 가장 기본적인 구문 중 하나입니다.
  • 조건문을 사용하면 프로그램이 특정 조건에 따라서 다른 동작을 하도록 할 수 있습니다.
{    
    if(조건식){
        document.write("실행되었습니다.(true)");   // 참 실행
    } else {
        document.write("실행되었습니다.(false)");  // 거짓 실행
    };
}

값 : // true : 1, 2, "0", "1", "ABC", [], {}, true ..... flase를 제외한 나머지
     // false : 0, null, undefined, false, ""(빈문자열)

 

if문 생략 
  • if문이나 else 문에서 명령이 한줄이면 중괄호{ }를 생략해서 좀 더 간단하게 작성할 수 있습니다.
{
    const num = 100;

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

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

값 : 실행되었습니다.(true)

 

삼항 연산자
  • 삼항 연산자는 else if문 대신에 간단한 조건식을 사용할 수 있게 해줍니다.
  • 이 연산자는 조건이 참(true)인 경우에는 처음에 나오는 값(참)을 반환하고, 거짓(false)인 경우에는 두 번째 값(거짓)을 반환합니다.
  • 기존 if문보다 더 효율적으로 사용이 가능합니다.
{
    const num = 100;

    // if(num == 100){
    //     document.write("true");
    // } else {
    //     document.write("false");
    // };

    (num == 100) ? document.write("true") : document.write("false");
}

값 : true

 

다중 if문
  • if문 이후에 여러 개의 조건을 검사해야 할 경우 else if문을 사용할 수 있습니다.
  • 여러 개의 조건 중 하나가 참(true)인 경우 해당하는 값을 실행하고 전체 if문을 종료합니다.
{
    const num = 100;

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

값 : 실행되었습니다.(num == 100)

 

중첩 if문
  • 중첩 if문은 if문 안에 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)");
    };
}

값 : 실행되었습니다.(1)실행되었습니다.(2)실행되었습니다.(3)

 

switch문
  • 다중 if문과 비슷하며 다중 if문으로 변경이 가능합니다.
  • 조건에 맞으면 break 키워드에 맞으면 그 실행문에서 끝납니다.
  • break 키워드를 안쓰게 되면 무한으로 빠지면서 모든 case 키워드를 실행합니다.
  • defalut 키워드는 switch문의 값과 일치하는 값이 없을 때 실행합니다.
{
    const num = 100;

    switch(num){
        case 90:
            document.write("실행90");
            break;
        case 80:
            document.write("실행80");
            break;
        case 70:
            document.write("실행70");
            break;
        case 60:
            document.write("실행60");
            break;
        case 50:
            document.write("실행50");
            break;
        default:
            document.write("0");
    };
}

값 : 0

 

while문
  • while문은 조건이 참인 동안 반복적으로 코드를 실행하는 루프를 생성합니다.
  • for문과 비슷하며 for문으로 변경이 가능합니다.
  • 조건식에 맞지 않으면 한번도 실행 안될 수 있습니다. 또한 무한으로 빠질 수 있습니다.
{
    let num = 0;
    while(num<5){
        document.write(num);
        num++;
    };
}

값 : 01234

 

do while문
  • do-while문은 조건식을 마지막에 평가하는 반복문입니다.
  • do-while문은 코드 블록이 최소한 한 번은 실행되어야 할 때 유용합니다.
  • do-while문은 일반적으로 조건이 참이거나 거짓일 때 반복문을 실행해야 할 경우에 사용됩니다.
  • while문과 달리, 먼저 코드 블록을 실행한 다음에 조건식을 검사하여 조건이 참이면 코드 블록을 다시 실행하고, 조건이 거짓이면 반복문을 종료합니다.
{
    let num2 = 0;
    do {     
        document.write(num2);
        num2++;
    } while(num2<5);
}

값 : 01234

 

for문
  • for 문은 자바스크립트에서 가장 많이 사용하는 반복문입니다.
  • for 문은 조건에 들어가는 값이 일정하게 커지면서 명령을 반복 실핼항 때 편리합니다.
  • for 문에서는 몇 번 반복했는지 기록하기 위해 카운터를 사용하고 for 문의 첫 번째 항에서 카운터 변수를 지정합니다.
for문 : 배열 안에 있는 숫자 나열하기 예제
{
    let num = [1, 2, 3, 4, 5, 6, 7, 8, 9];

    for(let i=0; i<num.length; i++){
        document.write(arr[i] + ",");
    }
}

결과 : 1,2,3,4,5,6,7,8,9,

 

중첩 for문
  • 중첩 for문이란 하나의 for문 내부에 또 다른 for문을 포함하는 것을 의미합니다.
  • 이는 반복문을 중첩하여 복잡한 로직을 처리하거나 이차원 배열 등 다차원 데이터를 처리할 때 자주 사용됩니다.
{
	for(let i=1; i<=5; i++){
    	console.log("i : " + i);
    	for(let j=1; j<=5; j++){
        	console.log("j : " + j);
    	}
	}
}

값 
i : 1 , j : 1 , j : 2 , j : 3 , j : 4 , j : 5
i : 2 , j : 1 , j : 2 , j : 3 , j : 4 , j : 5
i : 3 , j : 1 , j : 2 , j : 3 , j : 4 , j : 5
i : 4 , j : 1 , j : 2 , j : 3 , j : 4 , j : 5 
i : 5 , j : 1 , j : 2 , j : 3 , j : 4 , j : 5

 

continue문
  • continue문은 반복문 내에서 사용되며, 현재 반복에서 남은 코드를 실행하지 않고 다음 반복으로 건너뛰는 역할을 합니다.
  • continue문은 보통 for문, while문 등과 함께 사용됩니다.
  • continue문은 반복문 내에서 조건문과 함께 사용하여 특정 조건을 만족하는 경우에만 현재 반복을 건너뛰도록 할 수도 있습니다.
  • 이를 통해 반복문 실행 중 특정 조건에 따라 일부 작업을 생략하고 다음 작업으로 이어나갈 수 있습니다.
{
    for(let i=1; i<20; i++){
        if(i == 10){
            continue;
        }                
        document.write(i);
    }
}

값 : 123456789111213141516171819

 

break문
  • 코드 실행 중 break문을 만나게 되면 현재 실행문을 중지시키고 다음 실행문으로 넘어가게 합니다.
  • break문은 반복문이나 switch문을 종료할 때 사용됩니다.
  • break문은 주로 for문, while문, do-while문과 같은 반복문에서 사용됩니다. 반복문 내에서 break문이 실행되면, 반복문은 즉시 종료됩니다.
  • switch문에서 break문을 사용하면, switch문에서 해당 case의 실행이 끝난 후, switch문을 즉시 종료합니다.
{
    for(let i=1; i<20; i++){
        if(i == 10){
            break;
        }
        document.write(i);
    }
}

값 : 123456789

 

continue문, break문 참고

  • continue문과 break문은 실행문의 위치에 따라 값이 변경 될 수 있으니 참고하세요!!!   

 

참고 홈페이지

https://dongjin6539.tistory.com/11

https://dongjin6539.tistory.com/12

https://dongjin6539.github.io/web2023/javascript/javascript04.html

728x90
반응형