01. if문
조건문은 프로그래밍에서 가장 기본적인 구문 중 하나입니다. 조건문을 사용하면 프로그램이 특정 조건에 따라서 다른 동작을 하도록 할 수 있습니다.
{
// false : 0, null, undefined, false, ""(빈문자열) // false
// true : 1, 2, 3, "0", "1", "abc", [], {}, true // 0을 제외한 숫자와 문자, 배열, 객체
if(0){
document.write("실행되었습니다.(true)")
} else {
document.write("실행되었습니다.(false)")
}
}
결과 확인하기
조건문에 들어간 데이터가 형식에 따라 다르게 출력됩니다.
false : 0, null, undefined, false, ""(빈문자열)
true : 1, 2, 3, "0", "1", "abc", [], {}, true (0을 제외한 숫자와 문자, 배열, 객체, true값은 true)
02. if문 생략
if으로 작업할때 {}생략하여 출력할 수 있습니다.
{
const num = 100;
if(num) document.write("실행되었습니다.(true)");
else document. write("실행되었습니다.(false)");
}
결과 확인하기
변형 전
if(num){
document.write("실행되었습니다.(true)");
} else {
document. write("실행되었습니다.(false)");
}
03. 삼항 연산자
if문으로 작업할때 if, else, 중괄호를 생략하고 출력할수 있습니다.
{
const num = 100;
(num == 100) ? document.write("true") : document.write("false");
// if(num == 100){
// document.write("true");
// } else {
// document.write("false");
// }
}
결과 확인하기
원본보다 많이 사용하는 방법입니다.
원본에 풀어서 작업되어 있는 방법보다 삼항 연산자를 사용한 방법을 너 많이 사용합니다.
읽어낼때 풀어서 사용한 방법은 false까지 읽어내는 반면 삼항연산자를 이용한 방법은 true가 값이라면 true까지만 읽는다.
이는 많은 소스가 사용될때 유용합니다.
04. 다중 if문
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으로 선언하고 첫번째 조건문인 num == 90에 충족하지못하고 그다음 조건인 num == 100에 충족되에 출력문이 실행되었습니다.
05. 중첩 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)");
}
}
결과 확인하기
해설
상수 num을 100으로 선언하고 첫번째 조건문을 충족하면 다음 조건문을 충족하면 그다음 조건문을 충족하면 출력문을 실행합니다. 만약 하나라도 충족하지 못하면 else문이 실행됩니다.
06. switch문
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");
}
}
결과 확인하기
다중 if문과 비슷하지만 다릅니다.
중간에 break문을 사용하여 중간에 필요하지 않은 케이스까지 실행한다. 다중 if문과 다른 이유입니다. 비슷하지만 다르기 때문에 서로 변겨해가면서 사용할 줄 알아야합니다.
07. while문
조건문이 참일 때 실행되는 반복문이다. 조건은 실행되기 전에 참인지 거짓인지 판단합니다.
{
let num = 0;
while(num<5){
document.write(num);
num++; //증가값 반환
}
7
}
결과 확인하기
위 while문은 num이 5보다 작을때 까지 반복합니다.
let으로 변수를 선언할 때 0으로 시작해서 5와 같아지기 전까지 반복해서 출력합니다.
08. do while문
테스트 조건이 거짓으로 판명될때 까지 지정된 구문을 반복적으로 실행합니다.
{
let num2 = 0;
do {
document.write(num2); // 조건이 뒤에 있기때문에 한번은 실행됩니다.(사용하지는 않습니다.)
num2++
} while(num2<5);
}
결과 확인하기
한번이상은 무조건 실행합니다.
do while문은 거짓으로 판면될 때 까지 반복되는 형식이지만 조건문이 while문 뒤에 있기때문에 무조건 한번은 실행이 되어야 하는 구조입니다.
09. for문
for문은 주어진 조건이 참일 동안 반복적으로 코드 블록을 실행합니다.
{
for(let i = 1; i<=100; i++){
document.write(i + "<br>")
}
}
결과 확인하기
가장 기본적인 for문
초기화 : 변수를 초기화합니다. 조건 : 반복문의 조건을 설정합니다. 조건이 참이면 코드 블록이 실행됩니다. 증감식 : 변수를 증가시키거나 감소시키는 식입니다
09-1. for문 예제(배열)
for문은 주어진 조건이 참일 동안 반복적으로 코드 블록을 실행합니다.
{
//배열안에
const arr = [1,2,3,4,5,6,7,8,9]
//배열에서 꺼내오기
for(let i = 0; i<arr.length; i++){
document.write(arr[i]);
}
document.write("<br>")
//홀수만
for(let i = 0; i<arr.length; i+=2){
document.write(arr[i])
}
document.write("<br>")
//짝수만
for(let i = 1; i<arr.length; i+=2){
document.write(arr[i])
}
document.write("<br>")
// if문 이용해서 짝수홀수 분리하기
for(let i = 1; i<=arr.length; i++){
if(i % 2 == 0){
document.write("<span style='color:red'>"+i+"</span>");
} else {
document.write(`<span style='color:blue'>${i}</span>`);
}
}
}
결과 확인하기
홀수만 : 13579
짝수만 : 2468
if문 이용해서 짝수홀수 분리하기 :
09-2. for문 예제(테이블만들기)
for문으로 5*5테이블을 만들었습니다.
{
{
let table = "<table border = '1'>";
for(let i = 1; i<=5; i++){
table += "<tr>";
for(let j = 1; j<=5; j++){
table += "<td>"+j+"</td>";
}
table += "</tr>";
}
table += "</table>";
document.write(table);
}
결과 확인하기
09-3. for문 예제(반복횟수)
for문으로 반복한 횟수를 구하는 예제입니다.
{
let num = 0;
for(let i = 1; i<=25; i++){
document.write(i);
num++;
}
document.write("<br>");
document.write(num);
}
결과 확인하기
25 // 반복횟수
09-4. for문 예제(테이블에 숫자넣기)
테이블을 만들고 그 안에 숫자를 넣고 홀짝을 숫자로 구분하는 예제입니다.
{
let table = "<table border = '1'>";
let num = 0;
for(let i = 0; i<5; i++){
table += "<tr>";
for(let j = 0; j<5; j++){
num++
table += "<td>";
if(num % 2 === 0){
table += "<span style = 'color:red'>"+num+"</span>";
} else {
table += "<span style = 'color:blue'>"+num+"</span>";
}
table += "</td>";
}
table += "</tr>";
}
table += "</table>";
document.write(table);
}
결과 확인하기
10. 중첩 for문
for문 안에 for문을 넣어 표현하였습니다.
{
for(let i=1; i<=10; i++){
document.write(i,"<br>");
for(let j=1; j<=10; j++){
document.write(j,"<br>");
}
}
}
결과 확인하기
123456789102
123456789103
123456789104
123456789105
123456789106
123456789107
123456789108
123456789109
1234567891010
12345678910
반복에 반복...
중첩 for문은 첫번째 for문이 한번 실행되면 두번째 for문이 반복을 모두 끝난 후에 다시 첫번째 for문의 두번째가 실행됩니다. 이것이 반복되면 1[1234...10], 2[1234...10]...10[1234...10]와 같은 식으로 출력이 되게됩니다. 중첩for문에는 제한이 없으며 for문을 추가할 수 있습니다.
11. break문
break은 현재 소속된 반복문을 탈출합니다.
{
for(let i = 1; i<100; i++){
document.write(i);// 위치가 어디인지에 따라서 값이 달라짐
if( i == 10 ){
break;
}
}
}
결과 확인하기
탈출 명령어?
break문은 switch문과 반복문 안에서 사용할 수 있다. break문을 실행하면 가장 안쪽에 잇는 반복문이나 switch문을 빠져나옵니다.
12. continue문
현재 도는 레이블이 지정된 루프의 현재 반복에서 명령문의 실행을 종료하고 반복문의 처음으로 돌아가여 루프문의 다음 코드르 실행합니다.
{
for(let i = 1; i<20; i++){
if(i == 10 ){
continue;
}
document.write(i);// 위치가 어디인지에 따라서 값이 달라짐
}
}
결과 확인하기
강제 계속...
continu는 전체 반복문을 멈추지 않고, 현재 실행중인 반복 멈추고 다음 반복(조건식이 true일 때)을 강제로 실행 시키게 됩니다.