[JS] map

Map

map함수는 callback함수를 실행한 결과를 가지고 새로운 배열을 만들때 사용됩니다.

array.map(callbackfunction(value, index, array), this){
return 리턴된 해당 값들을 선언하는곳;
})

위의 예제처럼 사용되며, value는 배열을 돌며 사용되는 현재 값이며, index는 현재값의 인덱스, array는 map함수가 사용되는 앞의 array본인입니다. 뒤의 this는 콜백함수내의 this에서 사용되는 값입니다.

const data = [1,2,3,4,5,6]
const addData = data.map(function(value){
  return value = value + value;
});

console.log(addData) // [2,4,6,8,10,12]

위의 예시처럼 사용되며, addData의 변수에 콜백함수를 적용한 배열이 새로 선언됩니다.
해당내용은 화살표함수를 사용해서 좀더 간단하게 선언 할 수 있습니다.

const data = [1,2,3,4,5,6]
const addData = data.map(value => value+value);

console.log(addData) // [2,4,6,8,10,12]

Map함수는 객체에서도 사용이 가능합니다.

const cats = [
  { name : 'Lucky' , age : 2},
  { name : 'Vanilla', age : 1},
  { name : 'Latte', age : 1},
  { name : 'midSummer', age : 1}
]

const cat = cats.map(function(value, index){
  let check = {}
  check.[value.name] = value.age;
  return check;
});

console.log(cat) 
/*** [
  { Lucky : 2 },
  { Vanilla : 1 },
  { Latte : 1 },
  { midSummer : 1 }
]

위의 예시처럼 객체의 키값과 키에 해당하는 데이터를 따로 불러와 변경할 수 있습니다.