본문 바로가기

JavaScript

JavaScript 반복문

반복문: 반복문은 조건을 만족하는동안 코드블록 안에있는내용을 반복하는데 대표적으로 for문과 while문이있다.

for문의 기본형태

for(초기화값 ;  조건 ; 증감식;){
조건이 참일때 실행할 내용
}

ex)

let brands = ["애플","구글","페이스북","아마존", "삼성전자"]
for(let i=0; i<brands.length; i++){
  console.log(brands[i])
}


위코드를 해석해보자면 brands라는 변수안에 배열로 데이터를 저장했고 console.log를이용해 console창에 위배열을 하나하나 출력할껀데 이때 for이라는 반복문을 사용할꺼야 for에()안에는 i라는 변수를 선언해서 0이라는 초깃값을 설정해줬고 brands.length즉 brands라는이름을 가진 변수안에 배열에 길이는
5이니까 i가 5보다 작을때까지 실행할꺼야 그리고 코드블록이 한번실행될때마다 초기값이 0이었던 i에 1씩추가해줄깨 라고 말 할 수 있다.

length에 대해서 잘 모를수 있기때문에 부가설명을 하자면 index즉 배열에 번호를 먹일때는 0부터시작하지만 배열에 길이를 구할때는 1부터시작한다

반복문을 제대로 이해하기위해선 반복문이 돌아가는 구조를 이해해야한다 

위코드에서  i에초기값을 0으로설정했고 조건은 brands에길이(length) 즉 i가 5보다 작을때에만 반복문이 돌아가고 i가 반복문을 돌리는것을 성공하면 i에1을 더해준다는구조인데

i가 0이니까 brands.length 즉 5보다작으니까 조건이 성립하므로 코드블록 console.log(brands[i])가 실행된다 그후에 i에 1을 더해주고 i가1이된상태에서
brands.length 즉 5보다작으니까 또다시 코드블록이 실행되고 i에1을더해 2가된다.
이과정을 반복하다가 i에값이 5가됬을때 brands.length 즉 5보다 작아야한다는 조건이 성립하지않으므고 for문은 종료되는 형식이다.
여기서 i에1을 더해주는것은 ++가 i뒤에있어서 console.log(brands[i])가실행된후에 1이 더해진다는것을 알아야한다.

for-in문:객체를 반복할 때 사용한다 객체의 key값을 반환하기 때문에 [](대괄호 표기법)을 이용해 value값을 반환 받을 수 있다. 
for-in문에 기본형태:
for(const key in object){
실행할 내용
}

ex)

let person = {
  fName: "John",
  lName: "Doe",
  age:25
}

for(const p in person){
  console.log(person[p])
}


위코드를 해석하면 person이라는 변수안에 객체로 데이터를 만들었고 for in문을 이용해 person이라는 객체에 key값을 p라는 상수에 넣은후 키값의 수 즉 3개의 key가 존재하므로 3번반복한다  이때 const에사용된 상수는 꼭 p가아니여도 상관없다 중요한것은 이름이아니라 상수에 객체에 key값을 하나하나 담아내어 반복한다는 점이다.


여기서 console.log(person[p])라는부분에서 3번반복될동안 상수p에담아진 key값이 차례대로  하나하나 들어가게되고 그 key값에 value가 console창에 출력된다

for-of : for-of문은 배열을 반복 할 때 사용한다 변수에 배열의 요소가 반복할때마다 하나씩 담기게 된다

 

기본형태 : for(분리된요소를 출력받을 변수 of  분리할요소의 변수){
실행할내용
}

ex)

1.
let brands = ["애플","구글","페이스북","아마존","삼성전자"]
   for(const b of brands){
     console.log(b)
}

2.
let x = "javascript"

for(const a of x){
 console.log(a)
}

위코드 1번을 예시로 해석해보자면 brands라는변수에 배열을 담았는데 이배열에 요소 하나하나를 반복해서 출력하고싶어서 for-of 문을 사용했는데 for에()안에 요소하나하나가 담길 변수에이름을 b
요소하나하나에 대한 내용은 brands야 확인을 위해서 console.log를이용해 b를 출력해볼깨 라고 해석 할 수있다. 이해가 안된다면 직접 위 내용을 코딩해보고 해석해보자

while문 :대표적인 반복문중에 하나이다 조건이 참일때 코드블록을 실행하고 거짓이면 실행하지않는다 

기본형태 : 

초깃값설정

while(조건){
실행할내용
증감식
}
ex)

let i = 0

while(i<10){
console.log(i)
i++
}


for문과 while문에차이 
for문은 ()안에 초기값 조건 증감식을 전부작성하지만 while은 초기값을 while문 밖에서 작성하고 조건은 ()안에 증감식은 실행할내용이끝나는 부분 밑에 작성한다
특히 while문같은경우 조건을 잘못설정하면 무한루프 즉 끝나지않는 반복문이 실행될수있으므로 주의하자

배열을 다룰때에는 for문을 사용하고 특정조건을 다룰때에는 while문을 사용하라고 하는데 이말이 아직 크게와닿지는 않기에 일단 숙지만 하고있을예정이다.

'JavaScript' 카테고리의 다른 글

JavaScript 내장함수 문자열(string)편  (0) 2022.03.13
JavaScript 함수  (0) 2022.03.13
JavaScript 조건문  (0) 2022.03.13
JavaScript 연산자  (0) 2022.03.13
JavaScript의 데이터 타입  (0) 2022.03.13