자바스크립트 map메서드

map()

let arr = [2,3,4,5,6,7] // arr배열 선언
let newArr= arr.map((a)=> a * 3)  //배열arr에 map 메소드를 이용하여 객체마다 *3을 한 값을 newArr 변수로 선언후 출력
console.log(newArr) //[ 6, 9, 12, 15, 18, 21 ]

Array.map()

- map메서드는 배열 메서드이다. 반복문을 돌며 배열안의 요소들을 1대1로 짝을 만든다(mapping).

어떤 방식으로 짝지어 줄 것인가 정의한 함수를 메서드의 인자로 넣어준다

map으로 만든 배열은 새로운 배열을 짠다.

map() 메서드 기본구문

Array.map(function(element, index, array){  }, this);

콜백함수 function()은 각 배열요소에 대해 호출된다.

배열.map((요소,인덱스,배열) => (return 요소));

map() 메서드 콜백함수

Array.map((element)=> element + 실행하고 싶은 연산자와 값)

예시1

- 여기서 a는 배열안에 들어가있는 요소 하나하나를 가리키는 element이므로 a가 들어가도 되고 z가 들어가도 된다.

let arr = [2,3,4,5,6,7] // arr배열 선언
let newArr= arr.map((a)=> a * 3)  //배열arr에 map 메소드를 이용하여 객체마다 *3을 한 값을 newArr 변수로 선언후 출력
console.log(newArr) //[ 6, 9, 12, 15, 18, 21 ]

예시2

- 'string' 이라는 문자를 str이라는 변수로 선언하고 split메소드를 이용해 문자를 배열로만든다.

let str = 'string' //str변수로 선언
let strarr = str.split('')  //[ 's', 't', 'r', 'i', 'n', 'g' ]
let newArr= strarr.map((a)=> a + 'z')  //배열안에 있는 요소 하나하나 z문자를 추가한다.
console.log(newArr) //[ 'sz', 'tz', 'rz', 'iz', 'nz', 'gz' ]

요약

• map메소드는 배열에서 사용할 수 있는 메소드이다.
• for문으로 작성할 수 있는 식은 map메소드로도 작성 할 수있다.
• 기존의 배열의 값을 변경하는 것이 아니라 새로운 배열을 선언하고 새로운 배열에 map의 값이 들어간다.