map과 forEach와 다른점

for each

forEach(): Array 요소를 제공된 함수로 한 번 실행합니다.
콜백 함수를 인자로 받아, 배열의 각 요소에 콜백함수를 실행한다. 아무 값도 반환하지 않는다.
일반적인 forEach문은 다음과 같다.

arr.forEach(function(v, i, arr) {
  console.log(v);
});

forEach() 메소드는 아무것도 리턴하지 않는다(undefined).
단지 제공된 함수로 Array 요소를 호출한다. 이 콜백은 호출하는 Array를 변경할 수 있다. forEach문은 구문 밖으로 return값을 받지 못한다.

var arr = [1,2,3,4,5];
var newArr = arr.forEach(function(e, i) {
  return e;
});
// undefined

Map

map(): 모든 Array 요소가 제공된 함수로 호출될때 새로운 array를 생성합니다.
기존의 배열을 이용해, 새로운 배열을 생성할 때 사용한다. 콜백 함수를 인자로 받아, 배열의 각 요소에 대해서 실행한 결과 값을 반환한다.
일반적인 map 실행 방법

var newArr = arr.map(function(v, i, arr) {
  return condition;
});

map의 경우 요소가 아닌 새로운 값을 만들어서 return할 수 있다. return값 자체를 반환한다.

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