TIL - Array Methods

Array Methods

• Arrow function을 가장 많이 사용하는 경우 callback 함수로 사용할 때

• callback 함수 : 인자로 전달되는 함수

1. Callback 함수

var kvArray = [{key:1, value:10},
             	{key:2, value:20},
               {key:3, value: 30}];
var reformattedArray = kvArray.map(function(obj){ 
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
}

이 함수에서 map 이라는 method를 쓰면 다음에 오는 콜백함수의 obj는 매개변수
인자자리에는 모든지 다 올 수 있다.

2. Array.map()
   map method는 배열을 반복해줌
   callback 함수에서 return한 값으로 매 요소를 수정해줌
   map method의 return값은 수정된 값으로 다시 생성된 배열

Ex. 
const arr = [1, 2, 3];
const squares = arr.map(x => x * x) ;
map을 쓰면 배열을 반복해주는데 x는 인자로 , arr 이라는 배열의 요소고 
각 해당 요소를 x * x 해서 return 해준다.
여기서 쓰이는 x => x * x 가 callback 함수다
[여기서 보면 map이라는 method의 인자로 함수가 오는데, 그게 콜백함수!]
>> const squares = arr.map(x => x * x)는 
function squares = arr.map(function(x) { 
return x *x  
}) ; 

console.log(squares() ) ; 
→ 출력값 : squares = [ 1, 4, 9 ];

3. Array.forEach()

forEach는 for 대신 사용하는 반복문
map과의 큰차이 > forEach 함수 자체가 return 하는 것은 아무것도 없음
그냥 forEach 함수를 탈출하고 싶을 때, return을 사용

forEach 로 전달되는 callback 함수에서도 return하는 것이 X

forEach는 단지 for 문 대신 사용하는 반복 method입니다.

** 왜 ? for문 대신 forEach를 사용하지 ?
for Loop는 특정한 조건이 false일 때까지 반복되는 것인 반면에 forEach method는 각 배열의 요소를 iterate 하면 종료된다.

Syntax 
arr.forEach(callback(currentValue [, index [, array]])[, thisArg] ); 

* forEach에서 현재 index를 알고 싶을 때는 두번째 인자로 받을 수 있다.

let idxOfc = -1;
let arr = [‘a’, ‘b’, ‘c’, ‘d’]

arr.forEach((el, idx) => {
	if (el === ‘c’) {
	idxOfc = idx;
	return;
	}
};