[9일차] JavaScript map/ filter

0

TIL

목록 보기
10/21

1. array.map()

JS에서는 for문을 대체하는 map이 있다.

const friends = ["하나","둘","셋"]

friends.map((data) => data + "친구")
// ["하나친구", "둘친구", "셋친구"]

결과값이 배열 안 갯수와 같아야한다.

배열 안 객체 추가도 가능.

const friends = [
  {name:"하나"},
  {name:"둘"},
  {name:"셋"}
]

friends.map((data) => {(...data, age:10)})

0: {name: "하나", age: 10}
1: {name: "둘", age: 10}
2: {name: "셋", age: 10}

이렇게 배열 안에 데이터값을 추가해주는 기능.

2. array.filter

배열에서 필요한 데이터를 조건을 만들어 찾아내는 기능.

const classmate = [
    {name:"짱구", age:5, school: "떡잎유치원"},
    {name:"철수", age:6, school: "단풍잎유치원"},
    {name:"맹구", age:7, school: "떡잎유치원"},
]

1. 만약 단풍유치원 학생만 골라내고 싶다면

classmate.filter((db)=>(db.school==="단풍잎유치원"))
//0: {name: "철수", age: 6, school: "단풍잎유치원"}

2. 6살 이상만 골라내고 싶다면
classmate.filter((db)=>(db.age>=6))

//0: {name: "철수", age: 6, school: "단풍잎유치원"}
//1: {name: "맹구", age: 7, school: "떡잎유치원"}

3. map과 filter 를 같이 활용.

const classmate = [
    {name:"짱구", age:5, school: "떡잎유치원"},
    {name:"철수", age:6, school: "단풍잎유치원"},
    {name:"맹구", age:7, school: "떡잎유치원"},
]

1.떡잎유치원 애들한테만 지역:"서울"을 넣어보자.

const a = classmate.filter((db)=>(db.school==="떡잎유치원"))

a.map((db)=>({...db, 지역:"서울"}))

한줄로도 가능

classmate.filter((db)=>(db.school==="떡잎유치원"))
	.map((db)=>({...db, 지역:"서울"}))

//0: {name: "짱구", age: 5, school: "떡잎유치원", 지역: "서울"}
//1: {name: "맹구", age: 7, school: "떡잎유치원", 지역: "서울"}
profile
코린이의 코딩 성장기

0개의 댓글