for in 문과 for of문 그리고 map()에 대해서 알아보자

1. for in문

for in문은 자릿수 값 즉, 인덱스 값이 나옵니다. 

 

객체(키와 값) 때문에 만들졌기 때문에 객체에 사용할 수 있습니다.

 

객체의 key값과 value 값을 뽑아내는데 유용합니다.

 

객체의 키값의 갯수만큼 반복하여 첫 번 째 키값부터 마지막 키값까지 반복합니다.

const arr = [100,200,300,400,500];

for(let i in arr) {
	document.write(arr[i]);
}
	//100200300400500 이 나옴

식은 어렵지 않습니다. 

 

배열 array의 약자 arr로 이름을 정하고, i의 값을 구한다고 쓰면 됩니다. 

i는 배열 안의 데이터 값이기 때문에 대괄호 안에 넣어서 써주면 됩니다.

2. for of문

for of문을 써서 배열에서 데이터를 불러올 수 있습니다.

 

for of 반복문은 ES6에 추가된 새로운 컬렉션 전용 반복 구문입니다.

 

for of 구문을 사용하기 위해선 컬렉션 객체가 [Symbol.iterator] 속성을 가지고 있어야만 합니다.

const arr = [100,200,300,400,500];

for(let i of arr){
	document.write(i);
}
	//100200300400500이 나옴

for in문과 비슷하게 생겼지만 조금은 다릅니다. 

배열에서 데이터를 불러오는 식이기 때문에 i의 값을 구할 때 i만 써줍니다.

3. map()

map()은 배열 안에 있는 데이터를 다시 배열로 만들어 줍니다.

const num = [100,200,300,400,500];

num.map(function(el,i,a){
	console.log(el);
	console.log(i);
	console.log(a);
});
	//100
    //0
    //100,200,300,400,500
    //200
    //1
    //100,200,300,400,500
    //300
    //2
    //100,200,300,400,500
    //400
    //3
    //100,200,300,400,500
    //500
    //4 
    //100,200,300,400,500 이 나옴

배열에 있는 모든 요소들의 값을 변경해서 새로운 배열을 써야할 때 루프를 사용하여 수동으로 반복 처리하는 대신에 array.map()을 사용할 수 있습니다. 

이 array.map() 메소드는 콜백 함수를 이용해 각 요소에 호출해서 그 값을 변환하게 도와줍니다.

일반적으로 array.map() 메소드는 특정 숫자를 곱하거나 애플리케이션에 필요한 다른 작업을 수행하는 등 요소에 어떤 변경 사항을 적용하는 데 사용됩니다.

 

el는 element의 약자로, 값을 뜻하고, i는 index의 약자로 자릿수를 뜻합니다. a는 array의 약자로 배열을 뜻합니다.따라서, 가장 첫 번 째 값인 100이 출력되고, 자릿수의 가장 첫 번 째 값인 0이 출력되며, 배열이 출력되었습니다.그 후에는 연속적으로 그 다음 값들이 값,인덱스,배열의 순으로 출력된 것입니다.