JavaScript의 filter()란?

filter(callbackFn)
filter(callbackFn, thisArg)

예제

const fruits = ["apple", "banana", "grapes", "mango", "orange"];

// 검색 조건에 따른 배열 필터링(쿼리)
function filterItems(arr, query) {
  return arr.filter((el) => el.toLowerCase().includes(query.toLowerCase()));
}

console.log(filterItems(fruits, "ap")); // ['apple', 'grapes']
console.log(filterItems(fruits, "an")); // ['banana', 'mango', 'orange']

특징

1. 순회 메서드

• 배열의 각 요소에 대해 제공된 callbackFn 함수를 한 번씩 호출
• callbackFn이 참 값을 반환하는 모든 값으로 새 배열을 구성
• callbackFn 테스트를 통과하지 못한 배열 요소는 새 배열에 포함 X
  
  

2. 복사 메서드

• this를 변경하지 않음
  
  
• 원래 배열의 요소와 동일한 요소를 포함하는 얕은 복사본을 반환
  
  
• callbackFn으로 제공된 함수는 배열을 변경할 수 있음
  
  
• 배열의 length는 callbackFn을 처음 호출하기 전에 저장됨
  • callbackFn은 filter() 호출이 시작 후 초기 length 값을 초과하여 추가된 요소는 방문 X
    
    
  • 이미 방문한 인덱스를 변경해도 callbackFn이 해당 인덱스에 대해 다시 호출되지 X
    
    
  • 배열의 아직 방문하지 않은 기존 요소가 callbackFn에 의해 변경되는 경우, callbackFn에 전달된 값은 해당 요소가 방문될 당시의 값이며,  삭제된 요소는 방문 X

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/filter