자바스크립트 배열의 모든 요소가 동일한지 확인하는 방법

자바스크립트에서 배열에 담긴 모든 값이 서로 같은지 확인해야 하는 경우가 종종 있습니다. 예를 들어, 리터럴 값으로 이루어진 배열을 입력받아 배열 내 모든 요소가 동일하면 true를, 하나라도 다른 요소가 있으면 false를 반환하는 함수를 작성할 수 있습니다.

구현 아이디어

가장 간단하고 효율적인 방법은 배열을 정렬한 뒤 첫 번째 요소와 마지막 요소를 비교하는 것입니다. 정렬된 배열에서 첫 번째 요소와 마지막 요소가 같다면, 그 사이의 모든 요소도 반드시 같은 값이기 때문입니다.

또한 길이가 1 이하인 배열(빈 배열 또는 요소가 하나뿐인 배열)은 모든 요소가 자연스럽게 같다고 볼 수 있으므로 true를 반환하도록 처리합니다.

예제 코드

const arr1 = [1, 2, 3];
const arr2 = [1, 1, 1];

const checkIfSame = (arr = []) => {
    // 배열의 길이 추출
    const { length: l } = arr;

    // 빈 배열이나 요소가 하나인 배열은 true 반환
    if (l <= 1) {
        return true;
    }

    // 배열 정렬
    arr.sort();

    // 첫 번째 요소와 마지막 요소 비교
    return arr[0] === arr[l - 1];
};

console.log(checkIfSame(arr1));
console.log(checkIfSame(arr2));

실행 결과

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

false
true

코드 설명

arr1은 [1, 2, 3]으로 요소들이 서로 다르므로 false가 출력됩니다. 반면 arr2는 [1, 1, 1]로 모든 요소가 같으므로 true가 출력됩니다.

대안: every() 메서드 활용

배열을 정렬하지 않고 확인하고 싶다면 Array.prototype.every() 메서드를 사용할 수도 있습니다. 이 방법은 원본 배열의 순서를 유지한다는 장점이 있습니다.

const checkIfSame = (arr = []) => {
    return arr.every((val) => val === arr[0]);
};

console.log(checkIfSame([1, 2, 3])); // false
console.log(checkIfSame([1, 1, 1])); // true

every()는 콜백 함수가 하나라도 false를 반환하면 즉시 순회를 중단하므로, 큰 배열에서도 효율적으로 동작합니다.