1005 TIL

기멜·2021년 10월 5일
0

자바스크립트 독학

목록 보기
20/44

오늘도 화이팅! 아자! 이해할 수 있다! 💻
참조: 제로초 ES2021 자바스크립트 강좌 유튜브

반복문

간단한 반복문으로는 while문이 있습니다.

while문의 기본 형식

while (조건식) 
  동작문;
//조건식이 참인 동안 반복해서 동작문을 실행합니다.

if문과 같은 이유로 동작문이 하나더라도 중괄호로 묶어주는 것을 추천합니다.
기본 형식

while (조건식) {
  동작문1;
  동작문2;
  동작문3;
}

<코드 예제>

while (true) {
  console.log('hello, while!');
}

true 니까 'hello, while'이 반복되는데 false 표시가 없으니 무한반복이 됩니다. 그럴 때 변수가 필요합니다. 변수는 변하는 값이기 때문이죠.

let i = 1;
while (i <= 100) {
  console.log('hello, while!');
  i++;
}

이 코드를 실행하면 'hello, while!'이 100번 실행이 될 것입니다.
i는 1이고, 조건식 부분에 true는 1 <= 100 까지 라는 것이 되니까
i++로 인해 1씩 숫자가 올라갑니다. 그러나 101이 되면 조건식이 false가 되어 반복문이 멈춥니다.

i += 1 과 i++ 는 엄밀하게 따지면 같지 않습니다.

실제로 프로그래밍 할 때는 변수에 첫 값으로 1을 넣기보다는 0을 많이 넣습니다. 프로그래밍에서는 숫자를 0부터 세기 때문입니다. 0부터 시작하는 경우에는 조건식을 i <= 99 또는 i < 100 으로 바꿔야합니다.

let i = 0;
while (i < 100) {
  console.log('hello, while!');
  i++;
}

for문

반복문에는 while문 외에도 for문이 있습니다.

for문의 기본 형식

for (시작; 조건식; 종료식)
  동작문;
  • 시작 먼저 하고, 조건식이 참이면 동작문을 실행하고, 그 다음 종료식을 실행합니다. 이후엔 조건식 -> 동작문 -> 종료식 -> 조건식 -> 동작문 -> 종료식... 이런식으로 false가 될 때까지 반복합니다.

for문의 소괄호에는 세 가지 요소가 들어갑니다. 시작(식과 변수 선언이 들어갑니다.)과 조건식과 종료식입니다. 조건식과 동작문은 while문과 같습니다. 동작문이 여러 개인 경우 중괄호를 사용할 수 있습니다. 복잡해보이지만 코드를 넣어보면 그렇지 않습니다.

for (let i = 0; i < 100; i++) {
  console.log('hello, for!');
}
//실행결과 : (100) hello, for!

while문과 for문의 코드 동작을 보자 while문은 1-2-3-4순으로 코드가 실행되는데, for문은 1-2-4-3 순으로 실행된다.

1~100까지 찍히는 while문과 for문을 만들어보자

while문

let i = 0;
while (i < 100) {
  console.log(i+1)
  i++;
}

i가 0부터 시작하기 때문에 console.log(i+1)을 해야만 1부터 시작을 합니다. 만약 console.log(i)를 한다면 0부터 99까지 출력되겠죠
위의 코드를 for문으로 만들어 보겠습니다.

for문

for (let i = 0; i < 100; i++){
  console.log(i + 1);
}

이렇게 표현할 수 있습니다.

break문으로 반복문 멈추기

반복문을 중간에 멈춰야 하는 경우. 예를 들어, 반복문을 돌릴 대상이 무한히 많을 때가 있습니다. 자연수나 실수 전체를 대상으로 반복문을 돌리는 경우죠.
반복문으로 값을 하나씩 찾다가 원하는 값을 찾으면 반복문을 멈춰야 합니다.
멈추지 않으면 반복문이 실행되느라 다음 코드를 실행할 수 없고, 찾은 값을 사용할 수 없습니다. 이럴 때 break문으로 반복문을 멈춥니다.

let i = 0;
while (true) {
  if (i === 5) break;
  i++;
}
console.log(i);
< 5

위에 코드는 배운대로라면 while (true)이기 때문에 무한히 반복됩니다. 하지만 여기서 break문이 들어 있다는 점을 주목해야 합니다. i 가 5가 되면 반복문은 종료됩니다.

<참고> 무한 반복일 때 for문과 while문 중 어느 쪽이 편할까요?
무한 반복문을 표현할 때는 보통 while문을 더 많이 사용합니다. for문으로도 가능하지만 while문이 더 간결하기 때문입니다. 하지만 두 경우 모두 break문이 없으면 의미가 없습니다.

continue문으로 코드 실행 건너뛰기

가끔 반복문이 특정 조건에서만 실행되기를 원할 수도 있습니다. 이럴 때는 continue문을 사용합니다. continue문을 넣으면 이후 코드는 건너뛰게 됩니다.

let i = 0;
while (i < 10) { // 홀수만 console.log
  i++;
  if (i % 2 === 0) { // 짝수만
    continue;
  }
  console.log(i);
}
// 실행결과 : 1,3,5,7,9

i가 1씩 늘어나는데 continue문으로 2의 배수는 건너뛰어라 라고 되어서
1,3,5,7,9가 나온다. (i % 2 === 0) i를 2로 나누는 나머지가 0 이 되는 숫자들 즉, 2,4,6,8이 된다.

중첩 반복문 맛보기

for (let i = 0; i < 10; i++) {
  for (let j = 0; j < 10; j++){
    console.log(i, j);
  }
}
< 9 9

밖에 for문이 시작되고 안쪽 for문이 끝까지 반복되고, 다시 밖에 for문이 돌고 이걸 반복해서 둘 다 9, 9 라는 값을 내게 되는 것입니다.

profile
프론트엔드 개발자를 꿈꾸는 도화지 위를 달리는 여자

0개의 댓글