filter()
메소드는 특정 함수를 통과하는 값을 새로운 배열로 만들어 줍니다. 이를 통해 배열 요소 중 특정한 기준을 만족하는 요소들을 포함하는 새로운 배열을 생성할 수 있습니다.
const words = ['cool', 'happiness', 'voice', 'chocolate', 'sleepy']
const result = words.filter(word => word.length > 6);
console.log(result); // [happiness, chocolate]
다음은 MDN에서 제공하는 filter()
메소드 사용 예시입니다.
1. 10보다 큰 숫자 찾기
function isBig(value) {
return value >= 10
}
let filtered = [12, 5, 1, 120, 44].filter(isBig);
// [12, 120, 44]
2. 소수(prime number) 찾기
const array = [-3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];
function isPrime(num) {
for (let i = 2; num > i; i++) {
if (num % i == 0) {
return false;
}
}
return num > 1;
}
console.log(array.filter(isPrime)); // [2, 3, 5, 7, 11, 13]
3. JSON에서 유효하지 않은 값 필터링하기
let arr = [
{ id: 15 },
{ id: -1 },
{ id: 0 },
{ id: 3 },
{ id: 12.2 },
{ },
{ id: null },
{ id: NaN },
{ id: 'undefined' }
]
let invalidEntries = 0
function filterByID(item) {
if (Number.isFinite(item.id) && item.id !== 0) {
return true
}
invalidEntries++
return false;
}
let arrByID = arr.filter(filterByID)
console.log('Filtered Array\n', arrByID)
// Filtered Array
// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]
console.log('Number of Invalid Entries = ', invalidEntries)
// Number of Invalid Entries = 5
4. 배열 필터링 하기
let fruits = ['apple', 'banana', 'grapes', 'mango', 'orange']
/**
* Filter array items based on search criteria (query)
*/
function filterItems(arr, query) {
return arr.filter(function(el) {
return el.toLowerCase().indexOf(query.toLowerCase()) !== -1
})
}
console.log(filterItems(fruits, 'ap')) // ['apple', 'grapes']
console.log(filterItems(fruits, 'an')) // ['banana', 'mango', 'orange']
참고: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
'개발 > JavaScript' 카테고리의 다른 글
자바스크립트 join() 메소드 설명: 배열 요소를 문자열로 연결하기 (0) | 2020.12.18 |
---|---|
자바스크립트 즉시 실행 함수(IIFE)란? (0) | 2020.12.07 |
자바스크립트 동기/비동기 차이점은 무엇일까요? (0) | 2020.11.23 |