01. if문
JavaScript의 if 문은 조건에 따라 코드 블록을 실행하거나 건너뛰는 데 사용되는 제어 구조입니다. if 문은 프로그램의 흐름을 제어하기 위해 조건을 평가하고, 조건이 참(true)인 경우에만 특정 코드 블록을 실행합니다
{
// true : true, "문자열" , 1, 2, "1", "2", []
// false : false, 0, null, undefinde ""(빈문자열)
if(0){
document.write("실행되었습니다.(true)");
} else {
document.write("실행되었습니다.(false)");
}
}1. if의 소괄호 안에는 조건식이 들어갑니다.
2. true(참) 값이 나오는 것은 true, "문자열", 1이상의 수, 배열, 객체입니다.
3. false(거짓) 값이 나오는 것은 false, 0, null, undefined, ""(빈문자열)입니다.
결과 확인하기
02. 다중 if 문
다중 if 문은 여러 개의 조건을 연달아 검사하여 해당하는 조건이 참(true)인 경우에 각각 다른 코드 블록을 실행하는 구문입니다. 각 조건은 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("실행되었습니다.");
}
}
1. const num = 100;: 변수 num을 선언하고 초기값을 100으로 설정합니다.
2. if (num == 90): 첫 번째 if 문에서는 num 변수의 값이 90과 비교됩니다. 하지만 num의 값은 100이므로 이 조건은 거짓(false)입니다.
3. else if (num == 95): 두 번째 else if 문에서는 num 변수의 값이 95와 비교됩니다. 여기서도 num의 값은 100이므로 이 조건은 거짓(false)입니다.
4. else if (num == 100): 세 번째 else if 문에서는 num 변수의 값이 100과 비교됩니다. 이번에는 num의 값이 100이므로 이 조건이 참(true)입니다.
5. else if 블록들은 실행되지 않습니다. 왜냐하면 이전 조건이 참일 때 코드 블록이 실행되고, 나머지 조건들은 검사하지 않기 때문입니다.
6. 마지막으로 else 블록은 어떤 이전 조건에도 해당하지 않는 경우 실행됩니다. 이 경우에는 어느 조건도 참이 아니므로 "실행되었습니다."가 출력됩니다.
결과 확인하기
03. 중첩 if문
중첩 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")
}
}
첫 번째 if 문: num이 100과 같기 때문에 "실행되었습니다.1"이 출력됩니다.
두 번째 if 문: 이 if 문은 첫 번째 if 문 내부에 중첩되어 있으며, num이 다시 100과 같으므로 "실행되었습니다.2"가 출력됩니다.
세 번째 if 문: 이 역시 두 번째 if 문 내부에 중첩되어 있으며, num이 다시 100과 같으므로 "실행되었습니다.3"이 출력됩니다.
결과 확인하기
04. 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)");
// }
if(num == 100) document.write("실행되었습니다.(true)");
else document.write("실행되었습니다.(false)");
// 삼항 연산자(조건식 연산자) // 더 많이 사용됨.
(num == 100) ? document.write("true") : document.write("false");
}삼항 연산자는 조건식을 간결하게 표현할 수 있으며, 단순한 조건 검사 및 값을 할당할 때 특히 유용합니다. 위의 예제에서는 삼항 연산자를 사용하여 더 간결한 코드를 작성하였습니다.
결과 확인하기
실행되었습니다.(true)
true
05. if 문 생략 & 삼항 연산자
{
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("실행되었습니다.");
}
}자바스크립트에서 배열(Array)은 데이터 요소를 저장하는 컨테이너로, 하나의 변수에 여러 개의 값을 순서대로 저장할 수 있습니다.
결과 확인하기
05. switch문
switch 문은 JavaScript에서 여러 가지 조건에 따라 다른 동작을 수행하도록 하는 제어 구조입니다. 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("실행되었습니다.");
}
}switch 문은 다중 조건 분기를 처리하는 데 유용하며, 각 경우에 따라 다른 동작을 정의할 수 있습니다.
결과 확인하기
12345678910
06.do while문
do-while 문은 JavaScript에서 반복 작업을 수행할 때 사용하는 반복 제어 구조 중 하나입니다.
{
let num = 1;
do {
document.write(num);
num++;
} while(num &<=10);
}do 키워드로 시작합니다.
반복적으로 실행하려는 코드 블록을 중괄호 {} 안에 포함합니다.
while 키워드 다음에 조건을 지정합니다.
조건은 루프의 실행 여부를 결정하며, 조건이 참(true)인 동안 루프가 반복됩니다.
while 조건이 false가 될 때까지 루프가 실행되며, 최소한 한 번은 루프 코드가 실행됩니다.
결과 확인하기
08. for문
for문은 조건식을 만족할 때까지 특정 코드를 반복하여 실행합니다.
{
for( let i=1; i < 10; i++){
document.write(i);
};
}초깃값 1을 설정하고 10보다 작거나 같을경우 실행되며, 반복될때마다 i의 값이 1씩증가합니다. 이 동작을 끝날때까지 반복합니다.
결과 확인하기
09. break문
break문을 이용해 데이터를 제어합니다.
{
for(let i=1; i<10; i+=2){
document.write(i);
if( i == 5 ){
break;
}
document.write(i);
}
초깃값 1을 설정하고 10보다 작거나 같을경우 실행되며, 반복될때마다 i의 값이 1씩증가합니다. 이 동작을 끝날때까지 반복합니다.
결과 확인하기
10. continue문
continue문을 이용해 데이터를 불러옵니다.
{
for(let i=1; i<10; i+=2){
document.write(i);
if( i == 5 ){
continue;
}
document.write(i);
}
}초깃값 1을 설정하고 10보다 작거나 같을경우 실행되며, 반복될때마다 i의 값이 1씩증가합니다. 이 동작을 끝날때까지 반복합니다.
결과 확인하기
11. 중첩 for문
for문 앞에 for문을 사용한 것을 중첩 for문이라고 합니다.
{
const rows = 5; // 행 수 설정
// 행 수 만큼 반복하는 외부 for 루프
for (let i = 1; i <= rows; i++) {
// 각 행의 별 모양을 출력하는 내부 for 루프
for (let j = 1; j <= i; j++) {
document.write('* ');
}
document.write('
');
}
}중첩된 for 문을 사용하면 복잡한 패턴을 만들거나 2차원 데이터를 처리할 때 매우 유용합니다.
결과 확인하기
* *
* * *
* * * *
* * * * *