본문 바로가기
Front-end/js

Array Function 1 (Map)

by somlang_bba 2021. 12. 13.
728x90

map 함수는 ES5에서 처음 등장한 스펙으로 실제로 로직 구현에서 자주 등장하는 함수 중 하나이다.

 

우선 아주 쉬운 예를 하나 보도록 하자

 

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

let arr2 = arr.map((item) => {
	item + '일'
});

console.log(arr) // [1,2,3,4,5]

console.log(arr2) // ['1일','2일','3일','4일','5일']

 위의 코드와 같이 어떠한 배열이 있는데, 그 배열에 모두 똑같은 변화(추가 혹은 삭제 혹은 모두 같은 값)를 주기 위해 사용하는 것이 Array.prototype.map()이다.

 

그렇다면 실제로 직접 해 볼 수 있는 예제로 몇가지를 수행해보도록 하자!

(예제는 MDN사이트에서 가져왔으므로 정답은 MDN사이트에서 확인)

 

1. 배열에 들어있는 숫자들의 제곱근을 구하여 새로운 배열을 만들기

  ( arr1=[1,2,3,4,5] => arr2 =[1,4,9,16,25])

2. 배열 속 객체를 재구성하기

  ( obj = { name: 'tom', age : 16 }  => obj = { name : 'jane', age : 18 } )

 

  

728x90

'Front-end > js' 카테고리의 다른 글

ArrayFunction3 (forEach)  (0) 2021.12.21
ArrayFunction 2 (find, filter)  (0) 2021.12.14
유용한 Array 함수들  (0) 2021.12.08
3자리 마다 콤마찍기  (0) 2021.12.03
Optional chaining (?.) 와 Nullish coalescing (??)  (0) 2021.11.23