Javascript-map

JS의 map 메서드는 배열 내의 모든 원소에 callback 함수를 실행하는 메서드입니다.

 

reduce와 동일한 일을 한다고도 볼 수 있지만 return 값이 다릅니다. 

reduce의 리턴은 하나의 값이지만, map의 리턴은 배열입니다.

 

예를 들면 reduce는 한 배열의 모든 원소를 더해서 하나의 sum 을 구할 때 사용하고

map 은 한 배열의 모든 원소 각각에 * 2 를 하여 새로운 배열을 구할 때 사용합니다.

 

// sum reduce
const sum = [0, 1, 2, 3].reduce(
  ( accumulator, currentValue ) => accumulator + currentValue,
  0
);
// return is 6

// multiple map
const map1 = [0, 1, 2, 3].map((x) => x * 2);
// return is [0, 2, 4, 6]

 

이 때 map 의 input 은 다음과 같습니다.

 

• callback
  • currentValue
  • index (optional)
  • array (optional)
• thisArg (optional)

 

다음은 그 예시들 입니다.

 

제곱근

 

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots는 [1, 2, 3]
// numbers는 그대로 [1, 4, 9]

 

두 배열의 각 원소 더하기

 

const arr1 = [1, 2, 3, 4];
const arr2 = [10, 11, 12, 13];

const map1 = arr1.map(function (x, i) {
  return x + arr2[i];
});
// return is [11, 13, 15, 17]

 

index를 사용하면 여러 배열을 계산할 수 있다.

 

이처럼 map과 reduce를 잘 사용하면 for 문 대신하여 간결한 코드를 만들 수 있다.

 

'모든 출처는 mdn으로부터 옴'