[JavaScript] map 함수

map함수는 배열에 사용되는 메서드이다. 배열안의 값들을 순차적으로 순회하면서 배열안의 각각의 요소들의 값을 변환시켜 배열 결과값을 반환해주는 메서드이다.

아래의 예시를 보자.

// ex1)

const a = [1, 2, 3, 4, 5];

let result = a.map((v) => v * 2)

console.log(result); // [2, 4, 6, 8, 10]

result.map(b => b * 3); // [6, 12, 18, 24, 30]

// ex2)

const a = [1, 2, 3, 4, 5];

let aa = a.map((v) => {

if (v % 2 === 0) {

return '짝수';

} else {

return '홀수';

}

});

console.log(aa); // ["홀수", "짝수", "홀수", "짝수", "홀수"]

또한 map메서드는 첫번째 인자로 배열의 데이터를 순차적으로 받지만 두번째 인자로 해당 데이터의 인덱스 값도 받을 수 있다.




결과 =>

이러한 map 함수를 가지고 리액트에서 데이터를 출력할때 사용할 수 있으며

리액트로 예를들어 TODO List 를 만들었다고하면 리스트 중 특정 목록을 삭제하거나 수정해야 한다고 하면

각각의 데이터마다 고유한 key값을 가지고 수정, 삭제가 이루어지는데 그러한 key값을 생성하는데도 활용할 수 있다.