[ Javascript ] Array.prototype.filter()

filter() 메서드

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다.

 

구문

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

 

매개변수

• callback: 각 요소를 시험할 함수입니다. true를 반환하면 요소를 유지하고, false를 반환하면 버립니다.
• element: 처리할 현재 요소
• index: 처리할 현재 요소의 인덱스
• array: filter를 호출한 배열
• thisArg: callback을 실행할 때 this로 사용하는 값

 

반환 값

테스트를 통과한 요소로 이루어진 새로운 배열을 반환합니다. 어떤 요소도 테스트를 통과하지 못하면 빈 배열을 반환합니다.

 

예제

 

작은 값 걸러내기 [ 10 이하인 모든 요소가 제거된 새로운 배열을 만들어줍니다. ]

function isBig(value) {
    return value >= 10;
}

let array = [1, 2, 5, 10, 100, 1000];
let filltered = array.filter(isBig);

console.log(filltered); // [10, 100, 1000]

 

배열 내용 검색 [ 배열 내용을 조건에 따라 검색한 새로운 배열을 만들어줍니다. ]

let array = ["사과", "바나나", "도토리", "포도", "도장", "망고", "오렌지", "사다리"];

function filterItems(query) {
    return array.filter(function(el) {
        return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
    });
}

console.log(filterItems("사")); // ['사과', '사다리']
console.log(filterItems("도")); // ['도토리', '포도', '도장']

.toLowerCase() 메서드는 대문자를 소문자로 변경시켜줍니다. ( 한글만 사용할때는 사용하지 않아도 됩니다. )