# Javascript Map 정복하기

- Author: @kimyoungjo
- Published: 2020-01-28
- Updated: 2020-01-28
- Source: http://blex.me/@kimyoungjo/javascript-map-%EC%A0%95%EB%B3%B5%ED%95%98%EA%B8%B0
- Tags: 미분류

---

### Map
볼 때 마다 이해가 안되는 녀석이다. 이론적으로는 이해가 되는데 응용이 조금이라도 첨가되면 바로 뇌정지가 와버린다. 이번 기회에 응용까지 싹다 끝내버리려고 한다.

>map은 forEach와 마찬가지로 Array의 각 요소를 순회하며 callback 함수를 실행합니다. 다만, callback에서 return 되는 값을 배열로 만들어냅니다.

### 기본적인 사용법

```javascript
	const arr = [0, 1, 2, 3];
	
	let squaredElement = arr.map(function(element){
		return element * element;
	});
	
	console.log(sqauredElement); // [0, 1, 4, 9]
```

이것이 map의 기본 사용 예이다. 배열 원소의 제곱수를 얻기위해 function을 넣어주고 map은 그 결과들은 배열로 return 해준다. ```function```의 매개변수는 기본적으로 ```function(value(현재 element), index)``` 로 이루어져 있다.

다음 코드는 금일 알고리즘 1문제를 풀던 중 도저히 안풀려서 슬쩍 본 솔루션이다.

```javasciprt
	function solution(numbers) {
    var answer = numbers.map(v=>v+'') // 이 부분
                        .sort((a,b) => (b+a)*1 - (a+b)*1)
                        .join('');
    return answer[0]==='0'?'0':answer;    
	}

	var numbers= [3, 30, 34, 5, 9]
	console.log( solution(numbers) )

```

3번째 줄에서 ```map()```을 사용했는데 저 부분이 이해가 안갔었다. 설명에는 배열 요소들을 문자열로 바꿔준 후 그 결과값을 배열로 return을 받는다는데, 그냥 그렇다고 알아야 하는지 무언가 있는건지 찾아봐도 잘 안나와서 모르겠다. 그럼 굳이 ```v+''```보다는 ```String(v)```가 더 직관적이지 않나? (확인해보니 됨) 아무튼 배열이 주를 이루는 알고리즘 문제 특성상 ```map()```은 숨쉬듯 다룰 수 있을 정도가 되어야 한다는걸 다시 한 번 느꼈다.