Coding/JavaScript

[JavaScript] map()

junedev 2019. 11. 29. 14:46

map

 

자바스크립트 배열 객체의 내장함수인 map을 이용하면 복잡한 반복과정을 쉽게 이행할 수 있습니다.

 

const numbers = [1, 2, 3];
let result = numbers.map((v) => {
  return num += 1;
});
console.log(numbers); // 1, 2, 3
console.log(result); // 2, 3, 4

쉽게 말하면 map은 기존에 있는 배열을 이용하여 각 인덱스마다 반복처리를 하여 새로운 배열을 만드는 역할을 합니다.

 

리액트에서 활용했던 ES6의 화살표 함수를 이용하면,

let result = numbers.map(v => num +=1)

이렇게 더 간단하게 표현이 가능합니다.

 

 

특히 map은 리액트에서 반복되는 컴포넌트들을 렌더링할때 효과적으로 사용할 수 있습니다.