UX·UI - FrontEnd Dev. Story

프론트엔드/Javascript

자바스크립트 for / for of / for in 반복문 사용법 - JS

클로이겅쥬 2022. 1. 18. 14:13
반응형

 

 

 

 

 

 

 

 

 

 

1. for() 반복문


 

1-1) 배열에서 for() 이용하기

// 배열에서 사용법
const colors = ["red","green","blue","aqua"];

for( let i=0; i < colors.length; i++ ){
	console.log(colors[i]);	 //red green blue aqua
}

 

 

1-2) 객체에서 for() 이용하기

// 객체에서 사용법

const classA = [
	{name: "Chloe", age: 20, address: "Seoul"},
   	{name: "Andy", age: 25, address: "Busan"},
   	{name: "Jane", age: 18, address: "Daegu"},
];

for(let num=0; num < classA.length; num++){
	console.log(classA[num].name);	// Chloe Andy Jane
}

 

- 배열에서 num을 순서에 맞게 돌려서 key값(name)을 이용해서 순서대로 value 값 반환.

 

 

 

 

 

 

 

2. for of() 반복문


const colors = ["red","green","blue"];

for( let color of colors ) {
	console.log(color);  // red green blue
}

 

- 변수 colors에 담긴 배열을 돌려서 각각 color 값에 넣어 반환 

 

 

 

 

 

 

 

 

3. for in() 반복문


const classA = [
	{name: "Chloe", age: 20, address: "Seoul"}
];

for( let key in classA ){
	console.log(key);  // name age address
	console.log(classA[key]);  // Chloe 20 Seoul
}

 

- for in()문은 value값을 뽑아내는것이 아닌 프로퍼티값(key)를 뽑아내는건데, key값을 통해서 value값도 가져올수있다.

 

 

 

 

 

 

 

반응형