JavaScript 배열에서 짝수만 걸러내는 함수 만드는 방법

이번 글에서는 숫자로 이루어진 배열을 인수 하나로 받아, 입력 배열 중 짝수에 해당하는 값들만 담은 새로운 배열을 반환하는 함수를 작성해 보겠습니다.

함수 이름은 직관적으로 returnEvenArray라고 지어보겠습니다. 핵심 아이디어는 JavaScript의 filter() 메서드를 활용하는 것입니다. filter()는 콜백 함수가 true를 반환하는 요소들만 모아 새로운 배열을 만들어 주기 때문에, 짝수 판별 조건만 넣어주면 간단히 해결됩니다.

예제 코드

const arr = [3,5,6,7,8,4,2,1,66,77];
const returnEvenArray = (arr) => {
    return arr.filter(el => {
        return el % 2 === 0;
    })
};
console.log(returnEvenArray(arr));

위 코드에서 el % 2 === 0 조건은 해당 요소를 2로 나눴을 때 나머지가 0인지, 즉 2의 배수(짝수)인지를 검사합니다. 이 조건을 통과한 요소들만 필터링되어 새로운 배열로 반환됩니다.

실행 결과

콘솔에 출력되는 결과는 다음과 같습니다.

[ 6, 8, 4, 2, 66 ]

출력 결과를 보면 원본 배열에서 짝수인 요소들(6, 8, 4, 2, 66)만 순서대로 추출된 것을 확인할 수 있습니다.

추가 팁: 더 간결하게 작성하기

화살표 함수와 암시적 반환을 활용하면 코드를 한 줄로 더 깔끔하게 줄일 수 있습니다.

const returnEvenArray = arr => arr.filter(el => el % 2 === 0);

이처럼 filter() 메서드를 사용하면 반복문 없이도 선언적이고 가독성 높은 코드로 배열에서 특정 조건의 요소만 손쉽게 추출할 수 있습니다. 홀수를 구하고 싶다면 조건만 el % 2 !== 0으로 바꿔주면 됩니다.