[JS] the for loop

if else문에서 컨트롤 구조가 있다고 언급했었다. 다른 통제 구조 중 하나가 고리(the for loop)이다.

 

JS에서 기본 사항 섹션의 마지막 주제는 Loop이다. 

Loop는 모든 프로그래밍 언어의 근본적인 측면이다. 기본적으로 반복적인 작업을 자동화하게 해주기 때문이다. 즉 반복해서 수행해야 하는 작업들인것이다. 

 

체육관에 가면 웨이트 트레이닝을 한다고 가정해보자. 특정 역도 운동 10번을 반복한다고 치자

어떻게 표현해야 할까?

console.log("Lifting weights repetition 1 🏋");
console.log("Lifting weights repetition 2 🏋");
console.log("Lifting weights repetition 3 🏋");
console.log("Lifting weights repetition 4 🏋");
console.log("Lifting weights repetition 5 🏋");
console.log("Lifting weights repetition 6 🏋");
console.log("Lifting weights repetition 7 🏋");
console.log("Lifting weights repetition 8 🏋");
console.log("Lifting weights repetition 9 🏋");
console.log("Lifting weights repetition 10 🏋");

i)  counter의 초기 값이다. 

예제의 경우 counter는 1번에서 시작해 10번까지 가는 값이다. 이것을 counter rep이라고 한다. 반복이란 뜻이다.

for(let rep=1; rep <= 10)

let rep=1 일단 rep이라는 변수를 생성해야한다. let 변수를 사용해야하는 이유는 counter에서 나중에  for 루프에 의해 업데이트가 될 것이기 때문이다.  → for문의 첫번째 부분이다.

let rep=1; 두번째 부분은 세미콜론을 작성한다.

rep <= 10 두번째는 논리적 조건으로 루프의 각 반복 전에 평가가 되는 거다. 그래서 매번 하기 전에 루프의 코드가 실행된다. rep이 10이하로 유지되어야 한다는 조건이다.  rep <= 10은 루프의 각 반복전에 평가가 될것이다. 조건이 참이면 다음 반복이 실행된다. 그러나 조건이 거짓이면 루프는 멈춘다. 더 이상의 코드는 실행되지 않는다. 기본적으로 루프는 이 조건이 참인 동안 계속 실행된다. 

for 루프는 참인 동안 계속 실행된다. 

반복될 때마다 rep counter은 증가할 것이다. rep <= 10  조건은 여전히 유효함으로 어느 시점이 되면 10까지 올라간다. 10은 여전히 10보다 작거나 같다. 하지만 그 후에는 11이 된다. 11이 되면 루프는 멈춘다. 

for(let rep=1; rep <= 10;)

for문의 세번째 부분이다. 여기서 각 반복 후에 counter를 업데이트한다. 업데이트는 필요할까? 안필요할까?

필요하다. 왜냐면 counter은 영원히 1로 있을 테니까.. 이 조건은 절대 거짓이 될 수 없다. 

for(let rep=1; rep <= 10; rep = rep + 1)

여기서 하는건 이제 각 반복후에 counter를 1씩 증가시키는 것이다. 즉 이것은 ===1이라고 할 수 있다. 

for (let rep = 1; rep <= 10; rep ++)

rep = rep + 1 은 기본적으로 값이 1로 증가하는 것이다. 근데 rep = + 1이라고 쓰는 대신 rep ++로 작성하면 된다. rep ++은 rep 값을 1씩 증가하기 때문이다.

for (let rep = 1; rep <= 10; rep++) {
  console.log("Lifting weights repetition 1🏋");
}

문자열이 10번 출력된 것을 확인할 수 있다. 저기 출력된 값에 있는 10은 10번 프린트되었따는 것이다. 

 

프린트하려는 문자열의 숫자를 증가시키기 위해서는 어떻게 해야할 까..

"Lifting weights repetition 1🏋" ← 이 숫자를 counter의 현재 값으로 바꾸기만 하면 된다. 왜냐하면 여기서 정의한 이 변수, rep 변수는 그냥 보통 변수이니까.. 이 코드 블록(let부분의 코드 블록)안에서 사용이 가능한것이다.

 

for (let rep = 1; rep <= 10; rep++) {
  console.log(`Lifting weights repetition ${rep} 🏋`);
}

 템플릿 리터럴로 변환을 해봣따. rep 변수를 문자열에 삽입할 수 있도록 말이다. 즉 하드 코딩된 값을 제거한것이다. 기본적으로 문자열을 동적으로 구출했다. rep변수를 입력하면 맨 처음에 수동으로 작성한 것을 볼 수 있다.

 

어떻게?

 

이렇게 출력되었다. 

 

 

 

 

 

 

 

 

 

 

 

 

for문을 이용해 같은 코드를 반복하지 않았다. 그래서 loop의 counter를 1에서 초기화했다. let rep = 1; 여기에는 새로운 rep 변수를 생성했다. rep은 반복을 의미한다. (물론 변수 이름일 수도 있다.)

 

loop가 하는일은 반복하기 전에 확인하는 것이다. 여기 모든 조건이 여전히 사실인 것이다. 그럴 경우에만 루프를 계속 실행할 수 있다. 그 다음 반복을 실행한다.