안녕하세요! 가족과 함께하는 스마트 라이프입니다. 지난 시간에는 상황에 따라 판단하는 ‘if 조건문’을 배웠죠? 오늘은 마법사들이 가장 귀찮아하는 일을 순식간에 해결해주는 ‘무한 복제 마법(for 반복문)’을 배워보겠습니다. 똑같은 주문을 백 번, 천 번 외워야 할 때 이 마법 하나면 1초 만에 끝낼 수 있어요!
1. 반복문이란 무엇인가요? ‘마법의 자동 컨베이어 벨트’
학교 숙제로 “나는 착한 마법사가 되겠습니다”를 100번 써야 한다고 상상해 보세요. 손이 정말 아프겠죠? 하지만 반복문(for)을 사용하면 컴퓨터에게 “이 문장을 100번 복제해!”라고 명령만 내리면 됩니다. 자바스크립트의 for는 정해진 횟수만큼 마법을 되풀이하는 자동 장치와 같아요.
2. 무한 복제 주문서 작성하기 (코드)
화면에 별(★) 마법을 10개 한꺼번에 뿌려주는 코드를 작성해 봅시다. for 문 안에 들어가는 세 가지 약속을 잘 보세요!
<!DOCTYPE html>
<html>
<body>
<h2>✨ 마법의 별 복제기</h2>
<button onclick="make_stars()">별 10개 소환!</button>
<div id="sky" style="margin-top:20px; font-size:2em;"></div>
<script>
function make_stars() {
let sky = document.getElementById("sky");
sky.innerHTML = ""; // 밤하늘 초기화!
// for (시작; 끝; 다음단계)
for (let i = 1; i <= 10; i++) {
// 1부터 10이 될 때까지 하나씩 늘리며 반복해요
sky.innerHTML += "⭐";
}
}
</script>
</body>
</html>3. for 문속의 세 친구: 시작, 조건, 증감
for (let i = 1; i <= 10; i++) 안에는 아주 중요한 약속이 들어있어요.
1. let i = 1 (시작): “1번부터 셀 거야!” (번호표를 달아줘요)
2. i <= 10 (조건): “10번이 될 때까지만 해!” (멈추는 시점을 정해요)
3. i++ (증감): “한 바퀴 돌 때마다 번호를 1씩 올려!” (다음 순서로 넘어가요)
이 세 가지만 정확히 정해주면 컴퓨터는 절대 지치지 않고 마법을 반복한답니다.
4. 아이들과 함께하는 ‘인간 복제기’ 놀이
아이와 함께 ‘박수 반복 게임’을 해보세요. 아빠가 “for 3번!”이라고 외치면 아이가 박수를 세 번 치는 거죠. 이때 번호를 손가락으로 하나씩 세게 하세요(이게 바로 변수 i의 역할입니다). 번호가 목표 숫자에 도달하면 “탈출!”이라고 외치게 하면 반복문의 종료 조건을 자연스럽게 이해하게 됩니다.
마치며: 위대한 마법사는 도구를 잘 씁니다
힘든 일을 직접 하는 대신 똑똑한 도구(반복문)를 부리는 것이 진정한 마법사의 실력이랍니다! 이제 여러분은 엄청나게 많은 데이터를 한꺼번에 다룰 수 있는 힘을 얻었습니다. 다음 시간에는 여러 가지 마법 재료를 한 상자에 담아두는 ‘마법 가방(배열, Array)’에 대해 배워볼게요. 다음 시간에 만나요!
