fillter

filter

filter() 함수는 배열 내의 모든 요소 각각에 대하여 주어진 함수의 조건을 통과한 요소만 모아 새로운 배열로 반환한다.
(원본 배열은 변경되지 않는다)

filter 형식


arr.filter((value, index, array) => {
  // 조건이 true인 요소만 반환
  return 조건
})

value: 현재 처리 중인 요소값
index: 현재 요소의 인덱스
array: filter()를 호출한 원본 배열
반환값: 조건을 통과한 요소들로 이루어진 새 배열

filter 예제


const arr = [1, 2, 3, 4, 5]
 
const res = arr.filter((value) => {
  return value > 2
})
 
console.log(res) // [3, 4, 5]

화살표 함수로 간결하게 작성할 수 있다.


const res = arr.filter(value => value > 2)
console.log(res) // [3, 4, 5]

객체 배열에서 활용


const users = [
  { id: 1, name: 'gori', age: 28 },
  { id: 2, name: 'gildong', age: 17 },
  { id: 3, name: 'chunhyang', age: 16 },
]
 
// 나이가 18세 이상인 유저만 필터링한다
const adults = users.filter(user => user.age >= 18)
console.log(adults) // [{ id: 1, name: 'gori', age: 28 }]

map과의 차이

	`map()`	`filter()`
목적	모든 요소를 변환한다	조건을 만족하는 요소만 추린다
반환 배열 크기	원본과 동일	원본보다 작거나 같다
콜백 반환값	변환된 값	true / false