일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 일반 형제 결합자
- 인접 형제 결합자
- width속성
- html 태그
- tag html
- 아두이노
- focus 의사클래스
- sup태그
- id 선택자
- br 태그
- 전체 선택자
- html tag i
- 임베디드
- iframe
- Live Server
- html
- iframe 태그
- not 의사클래스
- background-color 속성
- css
- Checked 의사 클래스
- go live
- i 태그
- RGBA
- reveal in file explorer
- RGB
- height속성
- padding 속성
- sub태그
- 자식결합자
- Today
- Total
so woon!
[공통] 반복문 본문
학습일 : 2022. 09. 21
반복문
반복문은 어떠한 특정 구문(들)을 정해진 횟수나 특정 배열의 길이만큼 반복하고자할 때 사용한다.
1. `for` 반복문
`for` 반복문은 정수인 변수(이름은 주로 `i`)에 대해 그 값이 특정한 값 이상/이하/초과/미만일 때 그 값을 증가/감하며
어떠한 횟수만큼 반복하고자 할 때 사용한다.
- 아래 문법에서 초기화부분에 반복에 사용할 정수인 변수를 선언한다.
- 아래 문법에서 조건부분에 위 초기화 에서 선언한 변수에 대해 구현부를 반복할 조건을 명시한다.
- 아래 문법에서 증감부분에 위 초기화에서 선언한 변수를 증/가감할 표현식을 작성한다.
- `for` 반복문 실행 최초에 초기화를 1회 하며, 우선 조건을 확인한 뒤, 이가 참이면,
구현부를 실행하고, 증감한다. 그 후 조건을 다시 확인하고 그 뒤 절차를 반복한다.
조건확인 결과 거짓이면, `for`반복문을 빠져나간다.
for(초기화; 조건; 증감) {
// 반복할 구현부
}
아래 예제는 반복에 사용할 변수 `i`에 대해 `0`부터 `4`까지 반복하는 예제이다.
for(let i = 0; i < 5; i++) {
console.log(i);
}
// 0
// 1
// 2
// 3
// 4
아래 예제는 어떠한 특정한 길이를 가지는 배열을 반복하는 예제이다.
const days = ['월', '화', '수', '목', '금', '토', '일'];
for(let i = 0; i < days.length; i++) {
console.log(days[i] + '요일');
}
// 월요일
// 화요일
// 수요일
// 목요일
// 금요일
// 토요일
// 일요일
2. `for ⋯ in` 반복문
반복하고자 하는 대상이 되는 오브젝트(`Object`)의 키(Key)를 반복하고자 할 때 사용한다.
배열에 사용할 경우 배열이 가지는 각 원소의 인덱스 번호에 대해 반복한다.
for(원소선언 in 반복대상) {
// 반복할 구현부
}
const weekdays = ['월', '화', '수', '목', '금'];
for(let weekday in weekdays) {
console.log(weekday);
}
// 0
// 1
// 2
// 3
// 4
3. `for ⋯ of` 반복문
반복하고자 하는 대상이 되는 배열(`Array`)의 원소를 반복하고자 할 때 사용한다.
인덱스 번호가 반드시 필요한게 아니라면, 일반 `for`문보다 `for ⋯ of`를 사용하는 것이 오류로 부터 안전하다.
for(원소선언 of 반복대상) {
// 반복할 구현부
}
const weekdays = ['월', '화', '수', '목', '금'];
for(let weekday of weekdays) {
console.log(weekday);
}
// '월'
// '화'
// '수'
// '목'
// '금'
4. `while` 반복문
횟수와 관계 없이 특정 조건이 참인 경우 무한히 반복하고자 할 때 사용한다.
잘못 작성 시, 웹 사이트가 뻗거나 프로그램이 `응답 없음`상태가 되는 경우가 잦음으로 사용에 유의한다.
아래 예에서, `조건`이 참일 때 `반복할 구현부`를 횟수 제한 없이 실행한다.
단, `조건`이 애초에 거짓인 경우 `반복할 구현부`는 **단 한번도 실행되지 않는다**.
이는 구현부 **<u>실행 전에</u>** 조건을 확인하기 때문이다.
while(조건) {
// 반복할 구현부
}
5. `do ⋯ while` 반복문
횟수와 관계 없이 특정 조건이 참인 경우 무한히 반복하고자 할 때 사용한다.
잘못 작성 시, 웹 사이트가 뻗거나 프로그램이 `응답 없음`상태가 되는 경우가 잦음으로 사용에 유의한다.
아래 예에서, `조건`이 참일 때 `반복할 구현부`를 횟수 제한 없이 실행한다.
`while` 반복문과 달리, 구현부 실행 후에 조건을 확인함으로 조건과 관계 없이 최초 1회는 반드시 구현부가 실행된다.
do {
// 반복할 구현부
} while (조건);
6. 공통 키워드
1. `break`
현재 실행 중인 반복문의 실행을 중단한다.
for (let i = 0; i < 10; i++) {
console.log(i);
if (i % 2 > 0) {
break;
}
}
console.log('for문 종료됨.');
// 0
// 1
// 'for문 종료됨.'
2. `continue`
현재의 반복을 중단하고 다음 반복으로 진행한다.
for (let i = 0; i < 10; i++) {
if (i % 2 > 0) {
continue;
}
console.log(i);
}
console.log('for문 종료됨.');
// 0
// 2
// 4
// 6
// 8
// 'for문 종료됨.'
'Javascript > 개념정리' 카테고리의 다른 글
[공통] XHR Example (0) | 2022.11.01 |
---|---|
[공통] 오브젝트 (Object) (0) | 2022.09.22 |
[공통] 데이터 타입 (1) | 2022.09.22 |
[공통] 배열 (0) | 2022.09.20 |
[공통] 사용자 함수 (1) | 2022.09.19 |