Dev/JavaScript

[JavaScript] map 사용법

ujam 2022. 9. 24. 13:32
728x90
반응형

 

 

javascript에서의 map은 배열 내 각각 요소를 주어진 함수로 호출한 결과를 모아 새로운 배열을 반환해주는 메서드입니다.

 

 

 

let arr = [1, 2, 3, 4, 5];

위처럼 주어진 배열이 있다고 생각하고

각 항목에 +1을 해주어 새로운 배열을 정의하고 싶다고 했을 때

map이 아닌 for문을 사용해서 작성하면

 

 

let newArr = [];

for(let i = 0; i < arr.length; i++) {
	newArr.push(i + 1);
}

console.log(newArr); // [2, 3, 4, 5, 6]

 

 

이러한 형태로 작성을 할 수 있게 됩니다.

하지만 map 메서드를 사용하게 되면

 

 

let newArr = arr.map((v) => {
	return v + 1;
})

console.log(newArr); // [2, 3, 4, 5, 6]

 

 

map 메서드를 사용하여 배열에 있는 각 항목에 +1 을 더한 결과를 모아서

newArr라는 새로운 배열로 반환이 되었습니다.

 

 

 

for문을 사용하는 것 보다 map을 사용하게 되면 직접 반복문의 길이를 설정해주지 않아도 되고 따로 newArr라는 빈배열을 따로 선언하지 않고 나타낼 수 있어서 간편하기도하고 보기에도 간결한 거 같습니다. 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

728x90
반응형

'Dev > JavaScript' 카테고리의 다른 글

Moment.js를 Day.js로 대체하자  (0) 2022.12.04
[JavaScript] reduce 사용법  (0) 2022.10.22
[JavaScript] filter 사용법  (0) 2022.07.29
[JavaScript] ES2022 추가된 기능 살펴보기  (0) 2022.07.11
[JavaScript] 반복문 종류  (0) 2021.09.15