[Javascirpt] filter 함수

filter 메서드는 해당 조건이 참인 요소들을 모아서 새로운 배열로 반환하는 메서드이다.

배열에서 원하는 데이터만 추출하고 싶을 때 사용하는 메서드인데, 

여기서 중요한 부분은 새로운 배열을 반환해준다는 것이다.

또한 filter은 중복값을 제거해주지 않는다.

 

filter()

filter 도 map 함수와 마찬가지로 콜백함수를 인자로 받는데 모든 원소를 한번씩 돌리면서 콜백함수의 몸체부분에서 true 를 반환하는 원소들만 걸러준다. (filter결과값은 배열)

 

 

구문

arr.filter(callback(element[, index[, array]])[, thisArg])

 

매개변수

 

callback : 함수

element : 현재값

index : 인덱스

 

 

1. arr.filter(function(현재값) => {

   return 조건

})

 

2. arr.filter(현재값 => 조건)

 

 const arr1  = [ 10,20,30,40,50]
         const data = [
              {id:1, name:'홍길동'},
              {id:2, name:'강호동'},
              {id:3, name:'김철수'},
              {id:4, name:'김을동'},
              {id:5, name:'김태리'},
          ]
          
          //배열.filter ( 현재값  => 조건 ) -> 결과 배열
          const arr2  = arr1.filter( item => {
              return item > 30 
          })
          console.log( arr2 )

          const arr3  = arr1.filter( item => item >= 40 )
          console.log( arr3 )

          //30을 제외한 값 출력 : 데이터 삭제원리 
          const arr4 = arr1.filter( item => item !== 30 )
          console.log( arr4 )

          //data에서 id가 3인 사람만 출력하기 
          const arr5 = data.filter( item => {
              return item.id === 3 
          })
          console.log( arr5 )

          //2번 삭제 
          const arr6 = data.filter( item => item.id !== 2 )
          console.log( arr6 )

 

 

<참고>

filter mdn

Array.prototype.filter() - JavaScript | MDN (mozilla.org)

Array.prototype.filter() - JavaScript | MDN