가장 기본적인 반복문

오늘의 자바스크립트 속 가장 기본적인 반복문에 대해 설명해보겠습니다!😀

반복문은 컴퓨터가 가장 잘하며 가장 좋아하는 기능이라고도 볼 수 있습니다
반복적인 작업을 사람이 하게 되면 많은 노가다가 필요하며 시간이 오래걸리지만 컴퓨터에게 시킨다면 순식간에 작업이 완료 되죠

---

반복문의 기본적인 문법으로는
for in, for of, for, while이 있습니다!

그러면 천천히 반복문에 대해 알아보겠습니다 :)

---

for in

내일 해야하는 일을 작성해서 알고 싶은데요

for in 문법은 활용하여 위와 같이 작성할 수 있습니다

이 때 ${i} 는 몇 번째인지를 나타내며

${todos[i]} 는 몇 번째의 해야하는 일을 나타내줄 수 있습니다

결과는 이렇게 나오게 됩니다

이렇게 진행된다고 생가하시면 될 것 같습니다😀

P.S.
프로그래밍에서의 순서는 '0번째 1번째 2번째' 처럼 순서를 읽습니다.

console.log 안에 들어가는 문자열은 항상 `` 백틱을 적어 줘야합니다

반복문에는 관습적으로 i를 많이 적습니다

---

for of

for in 처럼 비슷하지만 for of 를 이용해서 다르게 표현할 수도 있습니다

살짝 수정을 했는데요 for in을 for of로 수정을 했습니다

자동적으로 반복문을 인식해서 todos안에 있는 해야하는 일을
${todo} 를 통해서 모두 출력해줬습니다👍🏻

결과는 위와 같이 나왔습니다

쉽게 const todos 안에 있는 요소들이
${todo}안으로 하나씩 들어간다고 생각하시면 될 것 같습니다🙆🏻‍♂️

---

for

가장 기본적이며 내가 정하는 횟수만큼 반복을 할 수 있는 문법입니다

이렇게 간단하게 적어줄 수 있는데요

콘솔창의 결과는

이렇게 출력이 되는 것을 볼 수 있습니다

이 방법도 위와 비슷한 원리인데요

0부터 출발을 하지만 10 전까지만 반복하며 하나씩 증가하여 반복된다 라고 정리해서 생각하시면 될 것 같습니다

---

while

while 은 if 와 비슷하게 작동하는 반복문입니다

조건을 꼭 넣어주어야하며 true 만 작동을 하는 원리입니다

P.S.
true 면 실행
false 면 정지

위와 같은 코드를 작성해봤습니다

while 의 기본 구조인데요
콘솔 결과를 보기 이전에
먼저 원리에 대해 알아보면

해당 원리로 진행하여 반복이 출력되게 됩니다

하단의 i = i + 1 은 i++ 로 변경이 가능합니다
완벽히 똑같은 의미는 아니지만 단순히 추가해서 숫자가 더해지는 의미는 같습니다
둘의 차이는 제가 조금 더 공부를 해서 가져올 수 있도록 하겠습니다...!!

이제 결과를 알아봅시다

ps.
열어두었던 크롬이 튕길 수 있으니 모두 저장해주세요..!!

수 없이 많이 반복이 되고 있는 모습을 보실 수 있습니다...!!

그 이유는 break을 넣어주지 않았기 때문인데요

항상 while 반복문에는 항상 break 을 넣을 수 있도록 합니다!

P.S.

위와 같은 원리와 순서로 작동이 되는 것을 볼 수 있습니다!

alert의 confirm 로 선택을 하여 추가적으로 반복을 진행할지 반복을 멈출지 선택할 수 있도록 하는 편이 좋습니다
어떤 방식으로든 꼭 break 를 활용할 수 있도록 합시다!