Language/Javascript

map과 filter

kimjingyu 2023. 5. 10. 03:47
728x90
  • map과 filter 모두 배열의 내장함수이다.

map

  • 배열의 원소를 일괄적으로 변형시킬 때 사용하기 좋다.
const classmate = ["철수","영희","훈이"]
classmate.map((item)=>(item+"어린이"))

const classmate = [
        {name: "철수"},
        {name: "영희"},
        {name: "훈이"}
]
classmate.map((item)=>({name : item.name + "어린이", school : "떡잎유치원"}))
  • 실무에서는 컴포넌트의 return 값 안에서 많이 사용한다.
  • map을 return 값 안에서 사용하기 위해서 { } 으로 감싸서 사용한다.
// RenderMap 컴포넌트
export default const RenderMap = ()=>{
    const classmate = ["철수","영희","훈이"]

    return(
        {classmate.map( (item)=> <div>{item}어린이</div> )}
    ) 
}

Filter

  • 배열의 원소를 필터링해주는 메서드이다.
const num = [1,2,3,4,5,6,7,8,9,10]

num.filter((item)=>(item<=8))
728x90