[JavaScript]
기초
- [JS] Js기초
- [JS] Js기초 변수
- [JS] Js기초 자료형
- [JS] Js기초 형변환
- [JS] Js기초 연산자
- [JS] Js기초 반복문
- [JS] Js기초 switch
- [JS] Js기초 function
- [JS] Js기초 객체
- [JS] Js기초 배열
중급
- [JS] Js중급 호이스팅(Hoisting)과 TDZ(Temporal Dead Zone)
- [JS] Js중급 생성자함수
- [JS] 객체 메소드(Object methods), 계산된 프로퍼티(Computed property)
- [JS] 심볼(Symbol)
- [JS] WeakMap WeakSet
- [JS] 숫자, 수학 method (Number, Math)
- [JS] 문자열 메소드(String methods)
- [JS] 배열 메소드(Array methods)
- [JS] 구조 분해 할당 (Destructuring assignment)
- [JS] 매개변수 리스트와 전개 문법(Rest parameters and spread syntax)
- [JS] 클로저(Closure)
- [JS] setTimeout / setInterval
- [JS] call / apply / bind
- [JS] 상속, 프로토타입(Prototype)
- [JS] 클래스(Class)
- [JS] 클로미스(Promise)
- [JS] 비동기 처리(Async/Await)
- [JS] Generator
- [JS] 메모리 릭(Memory Leak)
이제 반복문을 배워볼까? 코드를 여러 번 반복하는 마법이야! ✨
1. for문 (기본 중의 기본!)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| // 기본적인 for문
for (let i = 0; i < 3; i++) {
console.log(`${i}번째 안녕!`);
}
// 0번째 안녕!
// 1번째 안녕!
// 2번째 안녕!
// 배열 돌리기
let fruits = ["🍎", "🍌", "🍊"];
for (let i = 0; i < fruits.length; i++) {
console.log(`${i + 1}번째 과일: ${fruits[i]}`);
}
// 1번째 과일: 🍎
// 2번째 과일: 🍌
// 3번째 과일: 🍊
|
2. for…of (배열 돌리기 더 쉽게! 😎)
1
2
3
4
5
6
7
8
9
| let snacks = ["🍿", "🍪", "🍫"];
// 이렇게 하면 인덱스 신경 안써도 돼!
for (let snack of snacks) {
console.log(`과자 발견! ${snack}`);
}
// 과자 발견! 🍿
// 과자 발견! 🍪
// 과자 발견! 🍫
|
3. for…in (객체 돌리기! 🎯)
1
2
3
4
5
6
7
8
9
10
11
12
13
| let person = {
name: "김코딩",
age: 20,
hobby: "게임",
};
// 객체의 키를 하나씩 가져올 수 있어!
for (let key in person) {
console.log(`${key}: ${person[key]}`);
}
// name: 김코딩
// age: 20
// hobby: 게임
|
4. while문 (조건이 맞는 동안 계속! 🔄)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| // 기본 while문
let energy = 3;
while (energy > 0) {
console.log(`에너지가 ${energy}만큼 남았다!`);
energy--;
}
// 에너지가 3만큼 남았다!
// 에너지가 2만큼 남았다!
// 에너지가 1만큼 남았다!
// do...while (일단 한번은 실행하고 봐!)
let count = 0;
do {
console.log("최소 한번은 실행됨!");
count++;
} while (count < 1);
|
5. break와 continue (반복문 컨트롤하기! 🎮)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| // break로 반복문 탈출하기
for (let i = 1; i <= 5; i++) {
if (i === 3) {
console.log("3에서 탈출!");
break;
}
console.log(i);
}
// 1
// 2
// 3에서 탈출!
// continue로 건너뛰기
for (let i = 1; i <= 3; i++) {
if (i === 2) {
console.log("2는 패스!");
continue;
}
console.log(`${i}번째 실행`);
}
// 1번째 실행
// 2는 패스!
// 3번째 실행
|
6. 실전 예제! 🎯
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
| // 게임 캐릭터 레벨업 시스템
let level = 1;
let exp = 0;
const needExp = [100, 200, 300]; // 레벨별 필요 경험치
while (level <= 3) {
console.log(`현재 레벨: ${level}`);
exp += 150; // 경험치 획득!
if (exp >= needExp[level - 1]) {
console.log("레벨업! 🎉");
level++;
continue;
}
console.log(`다음 레벨까지 ${needExp[level - 1] - exp} 경험치 필요`);
}
// 현재 레벨: 1
// 레벨업! 🎉
// 현재 레벨: 2
// 다음 레벨까지 50 경험치 필요
// ... 계속!
|
꿀팁! 🍯
- 배열은
forEach
도 있어!
1
2
3
4
5
| let numbers = [1, 2, 3];
numbers.forEach((num) => {
console.log(`숫자: ${num}`);
});
// 더 깔끔하지 않아? 😎
|
- 무한루프 조심!
1
2
3
4
5
6
7
8
9
10
11
12
| // 이러면 큰일남 ㅋㅋ
// while (true) {
// console.log("영원히 돌아감...");
// }
// 탈출 조건 꼭 넣어주기!
let i = 0;
while (true) {
console.log(i);
i++;
if (i > 2) break; // 이렇게!
}
|
이제 반복문은 마스터! 뭐든 반복할 수 있다구! 🚀