본문 바로가기
Today I Learned/SeSAC 웹 2기

[새싹x코딩온] JS 조건문, 반복문

by suyeonnie 2024. 11. 7.

 

  • 조건문: switch
  • 반복문: for / while
  • continue와 break

 

1. 조건문 : Switch

 

조건문은 일단 If문, 삼항연산자, switch문이 있다.

switch문을 쓰라고 하는 문제가 나오면 뇌 버퍼링이 걸렸으므로 복습을 해보겠다.

//요일에 따라 다른 메시지를 출력
let now = new Date();
let day = now.getDay();
console.log(day); //요일 0(일)~6(토)

switch (day) {
  case 1:
    console.log('월요병 퇴치');
    break;
  case 3:
    console.log('이번주도 절반이나 왔다.');
  case 5:
    console.log('하하하하하하!!!! 금요일 소리질러!!');
  case 6:
    console.log('모두 즐거운 주말 보내세요');
  default:
    console.log('오늘을 즐겨요 😇');
}

 

if문, 삼항연산자와 다르게 switch문의 소괄호 안에는 조건이 아닌 boolean값이 나오는 `변수`가 들어간다. 변수와 case의 값이 일치할 경우 실행한다. 여기서는 모든 case에 `break`문이 있어서 실행 후 멈추고 빠져나온다. 

 

let level = 2;

switch (level) {
  case 1:
  case 2:
    console.log("초급자입니다.");
    break;
  case 3:
    console.log("중급자입니다.");
    break;
  case 4:
  case 5:
    console.log("고급자입니다.");
    break;
}

 

break문이 없는 경우 여러 case에 대해 같은 동작을 하도록 만들 때 유용하게 쓰인다. level이 1이거나 2일 때, `초급자입니다`가 출력된다.

 

 

2-1. 반복문 : for 문

console.log

for(let i=0; i<10 ; i++){
	console.log(`인사를 ${i+1}번째 드립니다! 😆`
}

 

 

초기화식, 조건식, 증감식을 받아서 조건식이 참일 경우 함수 영역의 내용을 실행한다. while문보다 for문이 더 읽기 쉽다 (소근소근)

 

 

2-2. 반복문: while문

while(조건문){
	//조건이 참일 때 실행할 코드
}

 

while문은 조건문이 true인 동안 반복을 실행하기 때문에, for문처럼 초기화식, 증감식(증가값)을 포함할 수 없다. 대신 초기화식과 증가값을 따로 설정해야한다. 이 점을 이용해서 조건이 항상 참인 경우로 설정해서 무한 루프(조심해...!)를 만들 수 있다. 

 

#예제1 - 1~10까지 숫자의 합 (while)

//1~10까지 숫자의 합
let sum = 0;
let i = 1; // 초기값 설정

while (i <= 10) { // 조건: i가 10 이하일 때만 반복
  sum += i; // sum에 i를 더함
  i++; // i를 1씩 증가시킴
}

console.log(sum); //55

 

 

#예제2-사용자 입력 합계 구하기 (while)

// 사용자 입력 합계 구하기
// - 사용자가 숫자를 입력할 때마다 숫자를 합계에 더해주는 프로그램
// - 사용자가 0을 입력하면 프로그램이 멈추고, 지금까지 입력한 숫자들의 합계 출력
let sum = 0;
let num;

while (true) { //무한 루프 시작
  num = Number(prompt("숫자를 입력하세요 (0을 입력하면 종료됩니다): "));
  if (num === 0) {
    break;
  }
  sum += num;
}

console.log(`입력한 숫자의 합: ${sum}`);

 

#예제3-while문 두가지 방법으로 풀기 (조건문 사용 O vs. 조건문 사용 X)

console.log

// 1번 타입, 조건문을 사용
let index = 0;
while (index < 10) {
  console.log("인사를 ", index + 1, "번째 드립니다! 😆");
  index++;
}

// 2번 타입, 조건문을 사용하지 않고 if 문 + break 사용
let index2 = 0;
while (true) {
  console.log("절을 ", index2 + 1, "번째 드립니다! 😆");
  index2++;
  if (index2 == 10) {
    break;
  }
}

 

 

#예제4- 두가지 방법으로 구구단 만들기 (while, for)

(1) while문 중첩

 

괜히 다른 방법으로 풀어보겠다고 객기를 부려서 continue, break를 잘못 사용했다. `n2`값을 증가시키지 못해 무한 루프 발생 & `n2`가 1에서 멈춘 상태로 계속 반복돼서 각 단의 *1만 출력되는 총체적 난국(무한루프로 맥북 멈춤 엔딩)을 확인할 수 있다.

//무한루프 엔딩 😈
let n1 = 2;
let n2 = 1;
while (n1 < 10) {
  console.log(`---${n1}단---`);
  if (n2 < 10) {
    console.log(`${n1}X${n2}=${n1 * n2}`);
    continue;
  }
  break;
}

 

`n2`를 증가시키는 부분을 추가하고, 각 단이 끝나면 `n1`을 증가시켜서 다음 단으로 넘어갈 수 있게 고치자.

let n1 = 2;

while (n1 < 10) {
  console.log(`---${n1}단---`);
  let n2 = 1; //n2의 각 단의 시작 때 1로 초기화

  while (n2 < 10) {
    console.log(`${n1}X${n2}=${n1 * n2}`);
    n2++; //n2를 1씩 증가시켜 1~9까지 곱셈 진행
  }
  n1++; //다음 단으로 넘어가기 위해 n1 증가시킴
}

 

(2) for문 중첩

for (i = 2; i < 10; i++) {
  console.log(`---${i}단---`);
  for (j = 1; j < 10; j++) {
    console.log(`${i}X${j}=${i * j}`);
  }
}

 

 

3. continue & break

조건식에 따라 반복문을 더 효율적으로 제어할 수 있는 continue, break에 대해 알아보자.

  • continue: 조건에 맞으면 현재 반복을 건너 뛰고, 다음 반복으로 넘어감
    • 특정 조건에 맞는 데이터만 생략하고 싶을 때
    • 특정 조건에서만 다른 작업을 하고 싶을 때
  • break: 조건에 맞으면 반복문을 완전히 종료하고, 반복문 밖으로 나감
    • 특정 조건에서 반복을 더 이상 실행할 필요가 없을 때

 

#예제1-배열에서 특정 조건의 값만 건너뛰기 (continue)

let names = ["영희", "철수", "민수", "수지"];

for (let i = 0; i < names.length; i++) {
  if (names[i] === "철수") {
    continue;  // "철수"일 경우 아래 코드를 건너뛰고 다음 반복으로 넘어감
  }
  console.log(names[i]);
}

 

`continue`는 '철수'를 출력하지 않고 다음 이름으로 넘어가게 해준다.

console.log(names[i]);

 

 

#예제2- 1~10까지 숫자 중 첫번째로 5를 찾으면 멈추기 (break)

for (let i = 1; i <= 10; i++) {
  if (i === 5) {
    break; // i가 5일 때 반복문 종료
  }
  console.log(i); // i가 1부터 4까지 출력됨
}