[JS] 반복문

 

1. for loop

가장 일반적인 for문 

var arr = [];
for(var i=0; i<10; i++){
	console.log(arr[i]);
};

• 가장 빠르고 단순함(효율적)
• 모든 자료형에 대해 사용이 가능
• 중간에 loop 건너뛰기나 종료가 가능함(continue, break)
• 반복범위 컨트롤이 가능함
• 변수를 활용할 수 있음

 

 

 

2. forEach

배열.forEach(요소,인덱스,배열)

var arr = ['가','나','다'];
arr.forEach(function(v,i,arr){
	console.log('v : ' + v);
    console.log('i : ' + i);
    console.log('arr : '+ arr);
});

• 빠른편
• Array객체에서 사용이 가능함
• 일반 for문보다 가독성이 좋고, 객체형을 다루기 쉬움
• for문과 다르게 중간에 끊을 방법이 없음(return으로 skip가능)
• return값을 갖지 못함

 

 

3. filter

var arr = [1,2,3,4,5];
var newArr = arr.filter(function(v){
	return v % 2 == 0;
});
console.log('newArr : ' + newArr);

var distances = [
	{from:'Seoul', to:'Jejudo', distance:23451},
    {from:'Busan', to:'Daegu', distance:6457},
    {from:'Daejeon', to:'Incheon', distance:233},
];

var filterDistances = distances.filter(function(item){
	return item.distance < 1000;
});
console.log('filterDistances : ' +filterDistances);

filter 메서드는 빈 요소를 반환하지 않는다는 것이 특징인데, 이를 이용하면 유용하게 쓸 수 있음

var arr = [0,,,1,,,,,2,,,,3];
var newArr1 = arr.filter(function(){return true;}); //[0,1,2,3]
var newArr2 = arr.filter(function(e){return e;});//[1,2,3]

• 빠른편
• Array객체에서 사용 가능
• chainable
• 빈 배열 요소를 반환하지 않음
• 대용량 배열 처리시 메모리 overflow 가능성이 있음
• return값은 true/false이며, 요소를 반환함

 

 

 

4. map

map은 기본적으로 filter와 문법은 똑같음

filter는 return값으로 true/flase만 쓸 수 있고 요소를 반환하지만,

map은 요소가 아닌 새로운 값을 만들어서 return할 수 있음

var arr = [1,2,3,4,5];
var newArr = arr.map(function(v,i,arr){
	return v+1;
 }); //[2,3,4,5,6]

• 빠른편
• Array객체에서 사용이 가능함
• chainable
• 대용량 배열 처리시 overflow 가능성이 있음
• return 값 자체를 반환함

 

 

 

5. reduce

배열.reduce(배열누적합, 원소, 인덱스, 배열)

var arr = [1,2,3,4,5];
var newArr = arr.reduce(function(accumulator, v, i, arr){
	console.log(accumulator); //1, 3, 6, 10
	return accumulator + v;
}); //15

reduce의 가장 큰 첫번째 특징은 첫번째 인자인 accumulator인데, accumulator는 return값을 누적하는데, 계속해서 전달받아서 사용 할 수 있음

두번째 특징은 accumulator의 초기값을 설정할 수 있다는 것인데, optional하며 생략시에는 첫번째 return값이 됨

var arr = [1,2,3,4,5]
var newArr = arr.reduce(function(accumulator, v, i, arr){
	return accumulator + v;
},100); //115