배열은 자바스크립트에서 데이터를 저장하고 관리하는 데에 유용한 자료구조입니다. 때로는 배열에서 특정 기준에 맞는 요소들만 필터링하여 사용해야 할 때가 있습니다. 이번 블로그 포스트에서는 자바스크립트에서 배열의 요소를 특정 기준으로 필터링하는 방법에 대해 알아보겠습니다.
1. Array.filter()
메소드 사용하기
자바스크립트에서는 Array.filter()
메소드를 사용하여 배열을 필터링할 수 있습니다. 이 메소드는 기본적으로 배열의 모든 요소를 반복하면서 주어진 조건을 만족하는 요소들만 새로운 배열로 반환합니다.
다음은 Array.filter()
메소드의 구문입니다.
const filteredArray = array.filter(callback(element[, index[, array]])[, thisArg]);
여기서 array
는 필터링할 배열이고, callback
은 각 요소를 검사하는 함수입니다. callback
함수는 조건을 만족하는 경우 true
를 반환하고, 만족하지 않는 경우 false
를 반환해야 합니다. callback
함수는 다음과 같은 매개변수를 가질 수 있습니다.
element
: 현재 처리 중인 요소index
: 현재 처리 중인 요소의 인덱스array
:filter()
메소드가 호출된 배열
여기서 thisArg
는 선택적 매개변수로, callback
함수 내에서 this
로 사용할 값입니다.
2. 예제 코드
다음은 Array.filter()
메소드를 사용하여 특정 기준으로 배열을 필터링하는 예제 코드입니다.
const numbers = [1, 2, 3, 4, 5];
// 짝수만 필터링
const evenNumbers = numbers.filter((number) => number % 2 === 0);
console.log(evenNumbers); // [2, 4]
// 홀수만 필터링
const oddNumbers = numbers.filter((number) => number % 2 !== 0);
console.log(oddNumbers); // [1, 3, 5]
// 값이 3보다 큰 요소만 필터링
const numbersGreaterThanThree = numbers.filter((number) => number > 3);
console.log(numbersGreaterThanThree); // [4, 5]
위의 예제 코드에서는 numbers
배열을 필터링하여 각각 짝수, 홀수, 3보다 큰 요소들로 구성된 새로운 배열을 생성하였습니다.
3. 결론
자바스크립트에서 배열의 요소를 특정 기준으로 필터링하는 방법을 배웠습니다. Array.filter()
메소드를 사용하여 배열을 필터링하면 간단하고 효율적으로 원하는 조건에 맞는 요소들을 추출할 수 있습니다. 이를 통해 코드의 가독성을 높이고, 원하는 데이터를 손쉽게 다룰 수 있습니다.