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 |