Dev/Web

[Javascript] 반복문-1탄 (For, For..in)

더움바다 2023. 11. 9. 22:40

Javascript에서 For문은 반복문이다.

심플하게 설명해보자면 어떤 동작을 반복해서 시행한다고 생각하면 된다.

ex) 평일 내내 학교 내지 회사를 감(반복됨) -> 반복문

 

Javascript의 반복문에서는 For, For..Of, For..in, while, do while(do while은 어지간하면 안쓴다)이 있다. 

(물론 이거 말고도 array에 붙여쓰는 map이라던지, foreach, reduce등등 더 있긴 하지만 이번글에서는 위 세가지 함수에 대해만 다룰 예정이다.)

 

for..of와 while, do while에 대해서는 다음 글에서 다루겠다.

// a에 1, 2, 3으로 이루어진 배열을 할당
const a = [1, 2, 3]

// for 반복문의 구조이다.
// 우선 반복문의 인덱스를 가지고 있을 변수를 한개 선언해준다.
// 두번째로는 조건문을 달아주고
// 세번째로는 반복문의 인덱스를 가지고 있는 변수에 변화를 준다.
// 여기서 반복문의 인덱스를 가지고 있을 변수를 상수로 선언해주게 되면 상수에 값을 재할당하지 말라는 에러가 뜬다.
// Uncaught TypeError: Assignment to constant variable.
for (let i = 0; i < 3; i++) {
	// a배열의 i번째 인덱스를 콘솔에 출력함
	console.log(a[i])
}

// 결과 
// 1
// 2
// 3

// for in문의 구조이다.
// 상수에는 배열의 인덱스 혹은 object의 key값이 들어온다.
// 그래서 index를 바로 출력하게 될 경우 다음과 같은 결과가 나온다.
for (const index in a) {
	console.log(a[index])
}

// 결과
// 1
// 2
// 3

// index를 바로 출력하게 되는 경우
for (const index in a) {
	console.log(index)
}

// 결과
// 0
// 1
// 2

// for in문은 object에서도 사용이 가능하다.
// b에 a: 1, b: 2, c: 3으로 이루어진 object 생성
const b = { a: 1, b: 2, c: 3 }

for (const key in b) {
	console.log(b[key])
}

// 결과
// 1
// 2
// 3

// index를 바로 출력하게 되는 경우
for (const key in b) {
	console.log(key)
}

// 결과
// a
// b
// c

'Dev > Web' 카테고리의 다른 글

[Javascript] 반복문-2탄 (For..of, while, do while)  (0) 2023.11.09
[JavaScript] Map vs Object  (1) 2023.11.09
[JavaScript] Falsy Value  (0) 2023.11.09