forEach, map 차이점

728x90

`forEach` does something for each item of an array.
배열 순회, 아무 값도 반환하지 않음

새로운 배열 반환
`map` does something for each item of an array and makes a new array of the returned values.

map의 용도를 제대로 살리려면 return 문이 있어야 합니다

기존의 배열을 이용해, 새로운 배열을 생성할 때

forEach()는 당신의 Array안에 데이터를 변경하려는 것이 아니라 데이터베이스에 저장하거나 로그아웃하는 것과 같은 작업에 유용할 수 있다.

var arr = ["a", "b", "c", "d"];

arr.forEach(letter => {
  console.log(letter);
});

// a
// b
// c
// d

map()은 데이터를 변경할 때 선호될 수 있다. 더 빠를 뿐 아니라 새로운 배열을 반환하며, 이는 다른 메소들과 함께 사용하는 것 같이 멋진 일을 할 수 있다는 것을 의미한다.(map(), filter(), reduce() 등)

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(num => num * 2).filter(num => num > 5);

// arr2 = [6, 8, 10]

map() 메소드는 Array안에 요소들을 호출한다. forEach()와 다른점은 값을 사용하고 Array와 동일한 사이즈의 새로운 Array을 반환한다.
결론적으로 map을 사용하면, 결과값을 배열로 받을수 있다. 함수 안의 결과값을 계산하지 않고, 배열로 받기 위해서는 map을 사용하는 게 유리하다.
map()은 메모리를 할당하고 리턴 값을 저장하지만, forEach()는 리턴 값을 버리고 항상 undefined를 리턴한다.
forEach()는 콜백함수로 현재 Array를 변환할 수 있으며, 대신에 map()은 새로운 Array를 리턴한다.

코딩 메모장