자바스크립트 : 데이터 제어하기

01. if문

if문은 조건식의 결과에 따라 중괄호 { } 로 묶어놓은 블록이 실행여부가 결정되는 조건문입니다.

//true 1, "1", "0"
//false 0 , undefined, null
if(1) {
    document.write("실행되었습니다(true).");
} else {
    document.write("실행되었습니다(false).")
}

결과보기

02. if문 생략

if문은 조건식을 생략할수있습니다.

const num = 100;
if(num){
    document.querySelector(".result02").innerHTML = "실행되었습니다(true)."
}else {
    document.querySelector(".result02").innerHTML = "실행되었습니다(false).";
}

결과보기

03. 다중 if문

다중 if문은 하나의 if문에 다른 if문을 추가할수있습니다.

const num = 100;
if(num){
    document.querySelector(".result02").innerHTML = "실행되었습니다(true)."
}else {
    document.querySelector(".result02").innerHTML = "실행되었습니다(false).";
}

결과보기

04. 중첩 if문

중첩If문은 중첩으로 묶을수있습니다.

const num = 100;
result = document.querySelector(".sample04_result");
if( num == 100 ) {
    result.innerHTML += "실행되었습니다(1)."
    if( num == 100 ){
        result.innerHTML += "실행되었습니다(2)."
        if( num == 100 ){
            result.innerHTML += "실행되었습니다(3)."
        } 
    } 
} else {
    result.innerHTML += "실행되었습니다.(4)";
}

결과보기

05. 조건부 연산자(삼항 연산자)

조건부 삼항 연산자는 JavaScript에서 세 개의 피연산자를 취할 수 있는 유일한 연산자입니다.

const num = 100;
result = document.querySelector(".sample05_result");

num == 100 ? result.innerHTML += "실행되었습니다.(num == 100)" : result.innerHTML += "실행되었습니다.(num == 값이없음)";

결과보기

06. switch문

switch문은 if문과 같이 조건 제어문에 속합니다.
하지만 switch문은 if문처럼 조건식이 >,>=,<,<=와 같은 이상,이하,초과,미만같은 부등식이 사용될 수 없습니다.

const num = 100;
result = document.querySelector(".sample05_result");

switch(num) {
    case 100 :
        result.innerHTML += "실행되었습니다.(num == 100)";
        break;
    case 110 :
        result.innerHTML += "실행되었습니다.(num == 110)"
        break;
    case 120 :
        result.innerHTML += "실행되었습니다.(num == 120)"
        break;
    case 130 :
        result.innerHTML += "실행되었습니다.(num == 130)"
        break;
    default :
    case 110 :
        result.innerHTML += "실행되었습니다.(num == 값이없음)"
}

결과보기

07. whire문

swhile문은 조건문이 참일 때 실행되는 반복문이다. 조건은 문장안이 실행되기 전에 참, 거짓을 판단합니다.

let num = 1;
result = document.querySelector(".sample07_result");
while( num <= 5) {
    result.innerHTML += "실행되었습니다.";
    num++;
}

결과보기

08. do whire문

테스트 조건이 거짓으로 평가될 때까지 지정된 구문을 실행하는 루프를 만듭니다.
단, 구문이 실행된 뒤에 테스트 조건이 평가됨으로 구문은 무조건 한 번은 실행됩니다

let num = 1;
result = document.querySelector(".sample08_result");
do {
    result.innerHTML += "실행되었습니다.";
    num++;
} while ( num <= 5)

결과보기

09. for문

for 문은 괄호로 감싸고 세미콜론으로 구분한 세 개의 선택식과, 반복을 수행할 문(주로 블럭문)으로 이루어져 있습니다.

result = document.querySelector(".sample07_result");
for( let i=1; i<5; i++) {
    result.innerHTML += i+". 실행되었습니다.";
}
let num = [1, 2, 3, 4, 5];
for( let i=1; i<num.length; i++) {
    result.innerHTML += num[i]+". 실행되었습니다.";
}

결과보기

10. 중첩 for문

for 문은 은 중첩으로도 사용할수 있습니다.

{
result = document.querySelector(".sample07_result");
for( let i=1; i<2; i++) {
    result.innerHTML += (i+". 실행되었습니다.");
    for( let j=0; j<3; j++){
        result.innerHTML += (j+". 실행되었습니다.");
    }
}

결과보기

11. break문

break 문은 동작하는 블록을 중지시킵니다.

for(let i = 1; i <= 20; i++) {
    document.write(i);
    if( i == 10) {
        break; // for문 정지
}

결과보기

12. continue문

continue문 은 정지후 다음단계를 시작합니다.

for(let i = 1; i <= 20; i++) {
    document.write(i);
    if( i == 10) {
        continue; // 정지후 다음 단계로 시작
    }
}

결과보기