[TIL]코어=>자바스크립트와 친해지기 #2 - While & 반복문

• 반복문 빠져나오기

  let sum = 0;
  
  while (true) {
    let value = +prompt("숫자를 입력하세요.", '');
    if (!value) break; // (*)
    sum += value;
  }
  
  alert( '합계: ' + sum );
  
  // 유저가 cancel 버튼(임의)를 눌러 조건이 충족되어 반복문이 즉시 중단된다면
  // 제어 흐름이 반복문 아래 첫 번째 줄로 이동한다.
  
  // 이는 본문 가운데 혹은 본문 여러 곳에서 조건을 확인해야 하는 경우에
  // '무한 반복문 + break' 조합을 사용하면 좋다.

• 조건에 맞춰 다음 반복으로 넘어가기

  for (let i = 0; i < 10; i++) {
  	// 10까지 1씩 증가하는 반복문
    // 조건이 참이라면 남아있는 본문은 실행되지 않습니다.
    if (i % 2 == 0) continue;
    // i를 2로 나눈 값의 나머지가 0이면 반복을 멈추고 다음 이터레이션을 강제로 실행한다.
    alert(i); // 1, 3, 5, 7, 9가 차례대로 출력됨
    // 나머지 값이 0인 경우를 다 패싱했기 때문에 홀수만 출력
  }
  
  // continue는 중첩을 줄이는데 큰 도움이 된다.
  
  for (let i = 0; i < 10; i++) {
    if (i % 2) {
      alert( i );
    }
  }
  // 같은 코드임에도 중첩 레벨이 늘어나고 코드가 길어지면 가독성이 떨어진다.

• break/continue 그리고 label

  // 여러개의 중첩을 한번에 빠져나와야 하는 경우라면..?!
  
  outer: for (let i = 0; i < 3; i++) {
    for (let j = 0; j < 3; j++) {
      let input = prompt(`(${i},${j})의 값`, '');
      // 사용자가 아무것도 입력하지 않거나 Cancel 버튼을 누르면 두 반복문 모두를 빠져나옵니다.
      if (!input) break outer; // (*)
      // input의 값이 변경되면 label에 해당되는 식별자 앞에 break를 넣어 해당 반복문을 탈출한다
    }
  }
  alert('완료!');

• Switch문은 언제 사용하면 좋을까?

  switch (browser) {
    case 'Edge':
      alert( "Edge를 사용하고 계시네요!" );
      break;
  
    case 'Chrome':
    case 'Firefox':
    case 'Safari':
    case 'Opera':
      alert( '저희 서비스가 지원하는 브라우저를 사용하고 계시네요.' );
      break;
  
    default:
      alert( '현재 페이지가 괜찮아 보이길 바랍니다!' );

결론

전에는 알지 못했던 break / continue의 사용조건, 그리고 label을 알 수 있었다. 자주 사용되지는 않더라도 코드가 길어지고 가독성이 어려울 때, 사용하면 유용하다.