[JS] 반복문(Loop)

2025. 1. 7. 11:01·Front-end/Javascript

반복문

특정 조건을 만족하면 해당 로직을 계속 실행한다

 

for 문

for (초기값; 조건식; 증감식) {}

 

1. 어떤 값부터 시작할래? : let i = 0

2. 어떤 값이면 멈출래? i < 5

3. 다음번에 이 값을 어떻게 할래? : i++

for (let i = 0; i < 5: i++) {
	console.log(i);
}
// 결과: 0 1 2 3 4

 

for - in 문

객체의 속성을 출력할 수 있다

let person = {
  name: "Bob",
  age: 30,
  gender: "male",
};

for (let key in person) {
  console.log(key + " : " + person[key]);
}

 

while 문

for문과 달리 () 안에 언제까지 로직을 실행할 것인지에 대한 조건만 전달한다

- while문 바깥 쪽에서 변수를 선언하고 값을 할당한다

- {} 안에서 다음 로직에 값을 어떻게 변화시킬 것인지 정한다

let i = 3;

// i가 100 미만일 때까지 로직을 반복한다
while (i < 100) {
  if (i % 5 === 0) {
    console.log(i + "는 5의 배수입니다");
  }
  i++;
}

 

do - while 문

do 내부 로직은 무조건 1번 실행한 뒤에 조건을 확인한다

let i = 0;

// do 안의 로직은 무조건 1번 실행함
do {
  console.log(i);
  i++;
} while (i < 10);

 

 

반복문 제어 키워드

01 break

break를 만나면 for 내부 로직을 실행하는 것을 멈춘다

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break; // i가 5가 되면 for 실행을 멈춤
  }
  console.log(i);
}

 

02 continue

continue를 만나면 해당 조건을 건너뛰고 다음 순서로 넘어간다

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    continue; // 5를 건너뛰고 다음으로 넘어감
  }
  console.log(i);
}

 

 

반복문이 필요한 이유

같은 동작을 여러 번 반복해야할 때 코드를 한 번만 작성하는 것으로 이를 간단하게 수행할 수 있다

 

 

반응형
저작자표시 비영리 변경금지 (새창열림)

'Front-end > Javascript' 카테고리의 다른 글

[JS] 배열 메서드를 알아보자  (0) 2025.01.08
[JS] this에 대해 알아보자  (0) 2025.01.07
[JS] 조건문(Conditional Statement)  (0) 2025.01.07
[JS] 함수(Function)  (1) 2025.01.06
[JS] 연산자(Operator)  (0) 2025.01.06
'Front-end/Javascript' 카테고리의 다른 글
  • [JS] 배열 메서드를 알아보자
  • [JS] this에 대해 알아보자
  • [JS] 조건문(Conditional Statement)
  • [JS] 함수(Function)
집으로 감자
집으로 감자
Hello World
  • 집으로 감자
    Potato to Home
    집으로 감자
  • 전체
    오늘
    어제
  • 링크

    • Github
    • 분류 전체보기
      • Front-end
        • TIL
        • Javascript
        • Typescript
        • React
        • Next.js
        • CSS
        • 라이브러리
      • Algorithm
        • 프로그래머스: 기초 트레이닝
        • 프로그래머스 LV1
      • TroubleShooting
      • Problem & Solution
      • Project
      • Programing Knowledge
        • 개발 용어
        • CS
        • 운영체제
        • 자료구조
        • 데이터 베이스
  • 태그

    프로그래머스
    tanstackquery
    회고
    트러블슈팅
    반응형웹
    http
    CSS
    코딩테스트
    Til
    styledcomponent
    실행컨텍스트
    JavaScript
    문제해결
    react
    개발용어
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
집으로 감자
[JS] 반복문(Loop)
상단으로

티스토리툴바