[javascript 자바스크립트] map 이란?

resilient

·

2021. 6. 14. 10:49

728x90
반응형

map 메서드는 다음과 같이 사용한다.

Array.map((요소, 인덱스, Array) => { return 요소 });

반복문을 돌며 배열 안의 요소들을 1대1로 짝지어 주는 것이다.

그래서 이름이 map이다. 매핑한다고 표현한다. 어떻게 짝지어줄 것인가 정의한 함수를 메서드의 인자로 넣어주면 되는 것이다. 파이썬의 map()함수와 같다.

파이썬 예시는 다음과 같다.

>>> a = [1.2, 2.5, 3.7, 4.6]
>>> a = list(map(int, a))
>>> a
[1, 2, 3, 4]
const number = [1, 2, 3];
let result = number.map((i) => {
  console.log(i);
  return i;
});
// 콘솔에는 1, 2, 3이 찍힘
number; // [1, 2, 3]
result; // [1, 2, 3]
number === result; // false

반복문으로 요소를 순회(1, 2, 3 순서로)하면서 각 요소를 어떻게 짝지어줄지 알려준다.

함수가 그냥 return v를 하기 때문에 같은 값을 그대로 짝지어준다.

알아둘 점은, map을 실행하는 배열과 결과로 나오는 배열이 다른 객체라는 것이다.

기존 배열을 수정하지 않고 새로운 배열을 만들어낸다. 단, 배열 안에 객체가 들어있는 경우, 객체는 공유된다.

규칙적인 배열만 반환할 수 있는게 아니라, 함수 안에 적어준대로 반환할 수 있기 때문에 자유도가 높다.

예를 들어서 배열안의 숫자가 홀수 인지 짝수인지 확인 해보는 코드를 작성해보자.

result = oneTwoThree.map((v) => {
  if (v % 2) {
    return '홀수';
  }
  return '짝수';
});
result; // ['홀수', '짝수', '홀수']

 

출처

반응형