map()
map.. 요놈은 누구일까?
반환한 값을 배열에 담아 반환해주는 함수이당!!
forEach() 와 다른 점은
- forEach는 반환값이 없음.
- map()은 반드시 배열을 반환함. 그래서 return을 적어야함.
그래서 map을 사용하는 예시를 한번 적어보겠습니댜.
let names = [
"Steven Paul Jobs",
"Bill Gates",
"Mark Elliot Zuckerberg",
"Elon Musk",
"Jeff Bezos",
"Warren Edward Buffett",
"Larry Page",
"Larry Ellison",
"Tim Cook",
"Lloyd Blankfein"
]
names.map((item) => {
return item
})
이렇게 적으면 names들을 반환은 해주지만, 반환된 값이 어디에도 저장이 되지않아서 보이지 않아오..
그래서 map() 은 변수에 반환값을 저장할 때 사용하면 좋다규
이것이 forEach() 와 차이점이 아닐까?
응용을 해보쟈규!
let names = [
"Steven Paul Jobs",
"Bill Gates",
"Mark Elliot Zuckerberg",
"Elon Musk",
"Jeff Bezos",
"Warren Edward Buffett",
"Larry Page",
"Larry Ellison",
"Tim Cook",
"Lloyd Blankfein"
]
let namesMap = names.map((item) => {
return item+"추가"
})
console.log(names)
console.log(namesMap)
요렇게 보면, names는 원래 names의 배열이 나오고,
namesMap에는 원래 names에 있는 아이템 뒤에 "추가" 라는 글씨가 붙은 애들만 배열로 반환되어있는 것을 볼 수 있어!
결론은 원래 배열을 건들이지 않고 따로 작업한 결과물을 새로 배열로 저장해주는거지!
또 다른 예제로 응용을 해볼까?
let ceoList = [
{name : "Larry Page", age : 23, ceo : true},
{name : "Tim Cook", age : 40, ceo : true},
{name : "Elon Musk", age : 55, ceo : false}
]
이 배열에서 나는 name만 불러와서 배열로 저장하고 시퍼~~ 하면 어떻게 해야할까?
let ceoList = [
{name : "Larry Page", age : 23, ceo : true},
{name : "Tim Cook", age : 40, ceo : true},
{name : "Elon Musk", age : 55, ceo : false}
]
let result = ceoList.map((item) => {
return item.name
})
console.log(result)
이렇게 item에서 name만 갖고와서 배열로 저장할 수가 있따.. 헐.. 완전 편리하쟈냐..ㅠㅠ
'Javascript > 이론+예제' 카테고리의 다른 글
배열 함수 every() (0) | 2022.10.20 |
---|---|
배열함수 some() (0) | 2022.10.20 |
배열함수 filter() (0) | 2022.10.20 |
배열함수 forEach() (0) | 2022.10.20 |
ES6 자바스크립트 최신 문법 정리 (0) | 2022.10.20 |