프론트엔드 개발/JavaScript

JavaScript) 반복문 - Array.forEach &object.for in

Ella Seon 2022. 10. 12. 17:20

➡️정 모르겠으면 그냥 console.log()로 확인하면서 규칙을 파악하자

 

✅배열안의 갯수만큼 반복하고 싶을 때는 어떻게 해야할까?

- length 로 해서 반복시킬 수 있다. 하지만 다음의 forEach 문도 한번 봐보자.

✅array.forEach

- array 안의 개수만큼 반복한다는 뜻

 

아래 예제를 살펴보면, 바지사이즈 array 변수에 4개의 데이터가 들어있다. 

데이터 갯수만큼 반복하고 싶으면 forEach 를 쓰면 된다. 

forEach 문에는 콜백함수가 반드시 들어가야한다.(콜백함수 : 함수 이름이 없는 함수)

 

let 바지사이즈 = [28,30,32,34]

바지사이즈.forEach(function(){
	console.log('안뇽')
	})

아래와 같이 콘솔창에 '안뇽' 이 4번 실행된 것을 볼 수 있다. 

- 콜백함수 안에는 파라미터 2개까지 작명이 가능하다.

첫번째 파라미터는 (혹은 1개의 파라미터만 넣으면) 반복문 돌때마다 array의 데이터들이

콘솔창에 찍힌다.

- 보통은 그래서 파라미터 명을 데이터 라고 짓는 경우가 많다. 

- 2번째 파라미터는 반복문을 돌때마다 0부터 1씩 증가하는 정수가 된다.

✅object.for in

- object 자료 갯수만큼 반복문을 돌리고 싶다면 for in 을 쓴다.

obj 안에 자료가 2개 들어있으니 '안녕' 이 2번 반복된다.

let obj = { name : 'kim', age : 20 }

for (var key in obj){
  console.log('안녕')
}

- for in 반복문을 쓰면 object 자료 안에 있는 key 와 value를 다 출력해볼 수 있다. 

let obj = { name : 'kim', age : 20 }

for (var key in obj){
  console.log(key)
}

결과 값으로 key 값을 뽑아낼 수 있는 걸 확인할 수 있다. 

- obj[key] 로 하면 value 값을 뽑아낼수 있는 것을 확인할 수 있다. 

var obj = { name : 'kim', age : 20 }

for (var key in obj){
  console.log(obj[key])
}