위코드-TIL-3 (JS-for loop)

jin_sk·2020년 5월 27일
0

위코드

목록 보기
10/49

반복문

반복문은 정지 조건이라는 지정된 조건에 도달할 때 까지 주어진 명령을 반복하는 프로그래밍 문법이다

프로그래밍에서 반복문은 매우 중요하다

예를들어 1~100까지의 숫자가 들어있는 배열이 있고 그 배열의 요소를 출력해야된다
반복문이 없다면 일일히

console.log(array[0]);
console.log(array[1]);
...
console.log(array[99]);

위와 같은 코드를 100번이나 써야한다

반복문은 같은 종류의 작업을 여러번 해야될 때 효율적으로 처리하기 위해서 사용한다


for loop

반복문의 한 종류로 아래와 같이 사용한다

for (초기화; 중지 조건; 증감식) {
    반복조건이 맞으면 실행할 코드
}
  1. 초기화 (시작값)
    루프를 시작하고, 반복을 시작할 처음 조건을 세팅한다

  2. 중지 조건 (끝값)
    반복하는 변수가 평가되는 조건이다
    조건이 true이면 { }안에 들어있는 코드가 실행되고,
    조건이 false이면 반복문 실행이 중지된다

  3. 증감식
    초기화된 변수의 값을 업데이트 시켜 중지 조건과 비교하게 하는 용도이다
    증감식을 지정하지 않거나, 잘못된 조건으로 지정하면
    중지 조건이 계속 true인 상태로 유지되어 무한루프가 되므로 주의해야 한다

동작순서를 살펴보면
(초기값) -> 중지조건 -> 코드실행 -> 증감식-> 중지조건 -> 코드실행 -> 증감식 -> 중지조건 -> 코드실행 ... 이런식으로 계속 반복

증감식의 ++, -- 연산자

다시 정리
++ variable : 변수를 사용하기 전에 변수를 증가시킵니다
variable ++ : 변수 사용 후 변수 증가

하지만 반복문에서 ++, --연산자가 앞에오나 뒤에오나 똑같은 값을 출력한다

for (let i = 1; i < 6; ++i) {
  console.log(i);
}

for (let j= 1; j < 6; j++) {
  console.log(j);
}
// 결과
1
2
3
4
5

1
2
3
4
5

for loop에서 if문 해석

for loop에서 if문이 들어가면 if의 조건의 맞는 결과만 출력할 수 있다

아래 예제를 살펴보면

const home = "대전";
let cities = ["서울", "대전", "대구", "부산", "광주", "제주도"];


for (let i = 0; i <= 5; i++) {
   if (cities[i] === home) {
     console.log("아, "+ cities[i] +" 사시는군요");
   }
}

배열 cities 요소가 home의 값과 같으면 console.log("아, "+ cities[i] +" 사시는군요") 를 출력한다

여기서 반복문을 사용하지 않으면 일일히 요소를 불러와 확인해야 한다

if (cities[0] === home) {
    console.log("아, "+ cities[0] +" 사시는군요");
} else if (cities[i] === home) {
    console.log("아, "+ cities[1] +" 사시는군요");
} ...

이런식으로 일일히 코드를 쳐야한다..
그래서 반복문이 중요하다

이처럼 반복문에 조건문을 사용하면 조건이 참인 결과만 도출해낼 수 있다


for loop사용한 배열 출력

앞의 if를 사용했을때 처럼 배열의 요소를 출력할때 반복문을 사용하면 편리하다
중지조건에 length 속성를 사용하면 더욱 편리하게 사용할 수 있다

const home = "대전";
let cities = ["서울", "대전", "대구", "부산", "광주", "제주도"];


for (let i = 0; i < cities.length; i++) {
   if (cities[i] === home) {
     console.log("아, "+ cities[i] +" 사시는군요");
   }
}

앞의 if 사용과 달라진 점이 있다면,
중지조건에 cities.length을 사용한다는 점이다
만약 앞의 if 사용과 같이 i <= 5을 사용했는데,
cities배열에 요소가 추가된다면 중지조건을 직접 수정해야 정확한 값을 출력할 수 있다

그래서 배열의 길이를 구하는 .length 속성을 사용하면 보다 편리하게 코드를 관리할 수 있다
cities의 요소가 추가 되어도 .length 속성으로 자동적으로 계산되기 때문에 수정할 필요가 없다

중지조건을 걸때 연산자도 잘 확인해야 하는데 초기화에 i = 0으로 시작하므로
cities.length보다 작아야 오류없이 결과를 도출할 수 있다
예를 들어

let arr = [0, 1, 3]
arr.length // 3 , 요소가 3개 들어있기 때문에

배열의 index0부터 시작하기 때문에 배열의 길이보다 작을 경우(<)로 중지조건을 걸어야 제대로된 결과가 나올 수 있다

그래서 .length속성을 사용해 배열의 마지막 요소를 출력할때는
항상 1을 빼줘야 한다 (index가 0부터 시작하기 때문에)


예제

인자로 전달받은 배열에서 가장 작은 값 출력하기

function findSmallestElement(arr) {
  min = arr[0]
  if (arr.length > 0) {
    for (let i = 0; i < arr.length; i++) {
      if (arr[i] <= min) {
        min = arr[i];
      }
    }
    return min;
  } else {
    return 0;
  }
}

let i = [20, 200, 23, 1, 3, 9];
console.log(findSmallestElement(i)); // 결과 1

가장 작은 값을 출력하기 위해 비교가 필요한 변수를 설정해준다
인자로 전달받은 배열의 첫번째 요소를 변수 min에 저장한다
for loop으로 배열의 요소를 min과 비교하여 배열의 요소가 min보다 작거나 같으면
min의 값을 해당 배열의 요소로 대체해 최소값을 출력한다

0개의 댓글