자바스크립트 반복문에 대해 알아보자
안녕하세요. 진득 코딩입니다.
프로그래밍을 하는 이유는 쉽게 말해 내가 하고 싶지 않은 일을 컴퓨터에게 대신시키기 위해서입니다.
보통 하기 싫은 일은 단순 반복적인 일일 경우가 많습니다.
이번 시간에는 반복적인 일을 수행해주는 구문인 반복문에 대해 알아보도록 하겠습니다.
for문
반복문은 크게 for문과 while문으로 나뉘는데 for문부터 알아보도록 하겠습니다.
for문은 조건식이 초기식, 조건식, 증감식이 들어가게 됩니다.
** for문의 구조
for(초기식; 조건식; 증감식){
(반복할 명령문_);
}
이때 초기식은 조건식에 들어가는 초기값을 의미하고, 조건식은 for문을 빠져나오는 조건, 증감식은 초기값을 반복할 때마다 바꾸는 식입니다.
이때 증감식이 없으면 무한 반복에 빠져 컴퓨터가 다운될 수도 있기 때문에 꼭 증감식을 이용해서 초기값이 for문을 빠져나올 수 있도록 해줘야 합니다.
위 for문을 출력하게 되면 안에 들어있던 문자열은 그대로 나오고 i는 증감식에 의해 1씩 증가되어 출력되게 됩니다.
for문의 활용
반복문을 사용할 때 항상 일정하게 증가하기만 하는 반복문을 사용하지 않습니다.
for문을 단순히 1씩 증가시키는 로직이 아닌 짝수를 출력하는 for문을 작성하며 for문의 활용에 대해 알아보도록 하겠습니다.
for문으로 짝수만 출력하는 방법은 여러 가지가 있지만 그중에서 두 가지 정도 살펴보도록 하겠습니다.
첫 번째 for문은 조건문(if문)을 넣어서 짝수인 값만 출력할 수 있도록 해주는 방법입니다.
두 번째 for문은 증감식 자체를 2씩 증가하는 증감식으로 바꾸는 방법입니다.
위 두 for문 중에는 두 번째 for문이 loop를 5번밖에 안돌기 때문에 처리 속도가 빠르게 됩니다.
조건이 복잡할 때는 증감식만으로 처리가 힘들기 때문에 첫 번째 for문을 사용하는 것이 좋습니다.
이처럼 여러 방식을 알고 있다가 적절한 방식을 사용하는 것이 좋습니다.
위 두 for문 모두 똑같이 짝수만 출력하는 것을 확인할 수 있습니다.
이중 for문
이중 for문은 프로그래밍을 배울 때의 첫 번째 관문이라고 할 정도로 처음 프로그래밍을 배울 때 머리가 아프고 어려운 부분입니다.
하지만 차근차근 살펴보면 그렇게 어렵지 않기 때문에 천천히 살펴보도록 하겠습니다.
우선 이중 for문으로 구구단을 출력하는 예제를 준비했습니다.
i가 들어간 겉에 있는 for문은 구구단의 단을 뜻합니다.
조건식을 i < 10으로 해도 되지만 가독성을 높이기 위해 i <= 9를 사용해 주었습니다.
안에 있는 for문은 각 단에서 곱하는 수를 뜻합니다.
이후 console.log에 각각의 위치에 위치시키고 값은 i와 j를 곱해서 나타내주면 구구단을 출력하는 이중 for문이 완성됩니다.
출력값이 너무 길기 때문에 많이 생략하였지만 코드가 정상적으로 9단까지 잘 나오는 것을 확인할 수 있습니다.
for문의 배열 활용
for문을 활용하여 배열을 쉽게 다룰 수 있습니다.
배열 포스팅에서 배열에 대해 살펴볼 때 위와 같이 4가지 아이템정도가 들어간 배열도 있지만 100여 가지 아이템이 들어간 배열도 존재합니다.
이때 배열에 있는 모든 값들을 출력할 때 for문을 유용하게 사용할 수 있습니다.
for문을 이용해 배열에 있는 아이템들을 출력할 때는 조건식에 (배열이름).length를 쓰게 되면 정확한 값이 들어가기도 하고 배열의 길이가 달라져도 코드를 바꿀 필요가 없기 때문에 유용합니다.
안에 있는 명령문에는 i를 index로 사용하면 반복문을 통해 쉽게 배열의 값들을 출력할 수 있습니다.
출력값에 fruit 배열에 있는 아이템들이 잘 출력된 것을 확인할 수 있습니다.
while문
while문도 for문과 같은 반복문이고, 조건이 하나밖에 없는 단순한 조건입니다.
while문에는 빠져나가게 되는 조건식만 작성해 주면 됩니다.
그래서 증감식이 따로 없기 때문에 while문 안에 증감식을 따로 작성해줘야 합니다.
초기값인 2부터 조건문의 조건인 9까지 잘 출력된 것을 확인할 수 있습니다.
이처럼 for문과 while문은 같은 기능을 하지만 for문은 범위를 정확하게 특정하여 몇 번 반복할지 알고 있을 때 사용하는 것이 좋고, while문은 반복 범위를 특정할 수 없을 때 쓰면 좋습니다.
for ... of와 for ... in
for문에는 편리한 기능이 있는 특별한 for문이 있습니다.
이러한 특별한 for문을 알아보기 위해 일단 for문에 대해 먼저 알아보도록 하겠습니다.
for문을 사용할 때에 배열과 함께 사용하는 경우가 많습니다.
위와 같은 fruit 배열을 for문으로 출력할 수 있습니다.
이때 이와 같이 for문을 배열에 사용할 경우에 쉽게 사용할 수 있는 특별한 for문, for ... of문이 있습니다.
for ... of문은 원래 알고 있던 for문보다 좀 더 단순한 구조를 가지고 있습니다.
for ... of문은 배열에 있는 데이터를 가져올 때 유용한 구문입니다.
문자열도 사용할 수 있는 이유는 문자열도 결국은 문자들을 배열에 넣어놓은 형태이기 때문입니다.
위와 같이 간단하게 이용할 수 있지만 for문처럼 세부 조절은 불가능하기 때문에 배열에 있는 데이터를 단순히 가져올 때만 사용하는 것이 좋습니다.
구조는 훨씬 간단해졌지만 같은 기능을 하여 배열 안에 있는 데이터들을 하나하나 잘 출력한 것을 확인할 수 있습니다.
또 하나의 특별한 for문은 키값을 가져올 때 간편하게 사용할 수 있는 for ... in문입니다.
특히 객체에 있는 동적인 키값을 가져올 때 굉장히 유용합니다.
두 번째 for ... in문처럼 해당 키가 존재하면 데이터를 가져오고 없으면 안 가져오는 식으로 해당 데이터가 있는 객체도 있고 없는 객체도 있을 때 모든 객체들에게 일괄적으로 데이터를 가져올 수 있습니다.
위 코드에서 요구한 데이터들이 잘 출력된 것을 볼 수 있습니다.
여기에서 배열의 key값은 index 값이라는 것을 알 수 있습니다.
반복문 문제
반복문은 프로그래머의 첫 번째 통곡의 벽인 이중 for문이 있는 곳이기 때문에 특히나 예제나 문제를 풀어보는 것이 중요합니다.
문제만 보고 먼저 나름의 답변을 생각한 후에 제가 만든 코드와 비교하는 것을 추천합니다.
문제1은 1부터 100까지 모두 더하는 for문을 만드는 문제입니다.
해당 문제는 for문을 1부터 100까지 돌리면서 미리 만들어둔 변수에 지속적으로 i값을 넣어주면 됩니다.
이때 result = result + 1을 result +=1로 작성하여 간단하게 표현해 줄 수 있습니다.
1~100까지 더한 숫자인 5050이 잘 출력된 것을 확인할 수 있습니다.
문제2는 1부터 100까지 홀수만 출력하는 반복문을 만드는 문제입니다.
굉장히 간단하게 초기값을 1로 주고 증감식을 2씩 증가하도록 설정해 주면 홀수만 출력됩니다.
값이 굉장히 많아서 중간에 잘랐기 때문에 궁금하신 분들은 코드를 작성해서 확인해 보시기 바랍니다.
홀수들이 잘 출력된 것을 확인할 수 있습니다.
반복문에서 자주 나오는 공포의 369게임입니다.
해당 문제의 풀이는 여러 가지가 있겠지만 필자는 String으로 만들지 않고 시도해 보았습니다.
해당 풀이는 숫자의 가짓수가 많아지게 되면 기능이 안 될 수도 있는 문제가 있습니다.
하지만 1~50까지는 충분히 369 결과를 프린트할 수 있기 때문에 위와 같이 코드를 작성하였습니다.
일단 for문으로 1부터 50까지 숫자를 출력한 후에 각각의 경우의 수에 따라서 if문으로 박수를 출력하도록 하였습니다.
** 경우의 수
1. 1의 자리가 3의 배수인 경우 : "짝" 출력
2. 10의 자리가 3의 배수인 경우 : "짝" 출력
3. 10의 자리와 1의 자리 모두 3의 배수인 경우 : "짝짝" 출력
마지막으로 else문에 i를 출력하도록 하여 짝이 출력되지 않는 숫자들은 숫자를 출력하도록 하였습니다.
너무 길어서 윗부분을 잘랐지만 의도한 대로 369 결과를 출력하였습니다.
문제4는 주어진 숫자가 소수인지 판별하는 프로그램을 만드는 문제입니다.
일단 소수의 특징은 소수는 1과 자기 자신 말고는 나머지가 0이 나와서는 안됩니다.
그렇다면 2부터 (자기 자신)-1까지의 숫자들로 모두 나머지 연산을 해서 하나라도 0이 된다면 false를 출력해 주고 하나도 0으로 나뉘는 숫자가 없다면 true를 출력해 주면 됩니다.
boolean형 데이터를 다룰 때에는 if문에서 코드가 실행이 안 됐을 때의 상황으로 초기값을 주는 것이 좋습니다.
if문에서 한 번도 나머지연산이 나오지 않는다면 true이기 때문에 초기값도 true로 두었습니다.
그리고 Math.random() 함수로 1~100 사이의 숫자를 만들어서 Math.floor로 정수로 만들어서 num 변수를 사용하여 새로고침할 때마다 다른 숫자가 들어가 소수인지 아닌지를 판별할 수 있도록 하였습니다.
또한 1도 소수가 아니기 때문에 num != 1이라는 조건을 추가해줬습니다.
1~100까지의 숫자 중 소수가 많이 없기 때문에 테스트도 할 겸 소수인 경우를 찾아 가져왔습니다.
숫자에 따라 성공적으로 소수인지를 판별하는 프로그램을 만들었습니다.
반복문 파트는 프로그래밍을 시작하는 사람들에게 첫 번째 벽이며 이 구간에서 생각보다 많은 사람들이 개발자를 포기하거나 이 부분의 개념이 흔들려서 프로그래밍을 하는데에 어려움을 많이 겪습니다.
한 번만 제대로 공부해 놓으면 다른 언어를 공부할 때나 프로그래밍을 할 때에 도움이 많이 될 것입니다.
이번 포스팅은 여기까지입니다.
궁금하신 사항이나 문의하실 사항은 댓글에 남겨주시면 열심히 답글 달도록 하겠습니다.
끝까지 봐주셔서 감사합니다.😊