JavaScript - 배열에서 정의된(undefined가 아닌) 요소 개수 구하기

JavaScript에서 요소들의 배열을 입력받아 처리하는 함수를 작성해야 합니다. 이 배열에는 undefined 값이 포함되어 있을 수도 있습니다.

우리가 만들 함수는 배열의 길이를 반환하되, 실제로 값이 정의된(defined) 요소의 개수만 계산에 포함해야 합니다. 즉, undefined나 빈 슬롯(empty slot)은 개수에서 제외됩니다.

예제 코드

이를 구현한 코드는 다음과 같습니다.

const arr = [12, undefined, "blabla", ,true, 44];
const countDefined = (arr = []) => {
    let filtered;
    filtered = arr.filter(el => {
        return el !== undefined;
    });
    const { length } = filtered;
    return length;
};
console.log(countDefined(arr));

동작 원리

위 코드의 핵심은 filter() 메서드입니다. filter()는 콜백 함수가 true를 반환하는 요소들만 모아 새로운 배열을 만듭니다. 여기서는 el !== undefined 조건을 사용하여 undefined인 요소를 걸러냅니다.

필터링된 새 배열의 length 속성을 구조 분해 할당으로 꺼내어 반환하면, 정의된 요소의 개수를 손쉽게 얻을 수 있습니다.

출력 결과

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

4

원본 배열에는 6개의 슬롯이 있지만, undefined 값 하나와 희소 배열(sparse array)의 빈 슬롯 하나가 제외되어 최종적으로 4가 출력됩니다.