패스트캠퍼스

javaScript-For, For of, For in 반복문

용용it 2023. 4. 24. 20:48

For 반복문

 

for 문은 반복적으로 코드를 실행할 때 사용되는 반복문 중 하나이다.

 

for 반복문의 기본 문법이다.

for (초기화; 조건; 반복 후 실행될 코드){
    // 반복 실행할 코드
}

 

아래는 for 문을 이용한 반복문이다.

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

// 0
// 1
// 2
// 3 
// 4
...
// 9

 

if 문을 써서 다음과 같은 예제를 만들 수도 있다.

for (let i = 9; i > -1; i -= 1) {
	if (i < 4){
    	break
    }
    console.log(i)
}
 
// 9 
// 8
// 7
// 6
// 5
// 4

For of 반복문

for of 반복문은 반복 가능한 객체를 순회할 때 사용된다.

 

const fruits = ['Apple', 'Banana', 'Cherry']

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

// Apple
// Banana
// Cherry
const users = [
	{
    	name: 'Yongsoo',
        age: 100
    },
    {
    	name: 'Dragon',
        age: 999    
    },
    {
    	name: 'back',
        age: 50
    }
]

for (let i = 0; i < users.length; i += 1){
	console.log(users[i])
}

// {name: 'Yongsoo', age: 100}
// {name: 'Dragon', age: 999}
// {name: 'back', age: 50}


for (const user of users) {
	console.log(user)
}

// {name: 'Yongsoo', age: 100}
// {name: 'Dragon', age: 999}
// {name: 'back', age: 50}

두 번째 예제에서 

for (let i = 0; i < users.length; i += 1){
	console.log(users[i])
}

for 문을 이용한 코드와

 

for (const user of users) {
	console.log(user)
}

for of를 이용하여 짠 코드는 서로 같은 결과를 나타낸다.

더욱 간결하고 깔끔하게 코드를 정리할 수 있다.

 


for in 반복문

객체 데이터에서는 in 을 사용하여 속성에 접근할 수 있다.

배열은 of를 사용.

const user = { 
	name: 'Dragon',
    age: 100,
    isValid: true,
    email: 'test@gmail.com'
}

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

// name
// Dragon
// age
// 100
// isValid
// true
// email
// test@gmail.com


 
console.log(user.name)  // Dragon
console.log(user.age) // 100
console.log(user['name']) // Dragon