JavaScript로 두 배열의 동등성을 테스트하는 방법

이번 포스팅에서는 두 개의 배열을 인자로 받아 각 위치에 해당하는 요소들을 하나씩 비교하고, 모든 요소가 완전히 일치하면 true, 그렇지 않으면 false를 반환하는 JavaScript 함수를 작성해 보겠습니다.

배열끼리 단순히 == 또는 === 연산자로 비교하면 참조값(메모리 주소)만 비교되기 때문에, 내용이 같아도 서로 다른 객체라면 false가 반환됩니다. 따라서 배열의 실제 내용을 비교하려면 직접 함수를 구현해야 합니다.

구현 로직

함수는 다음과 같은 순서로 동작합니다.

1. 두 배열의 길이(length)를 먼저 비교하여 다르면 즉시 false를 반환합니다.
2. 반복문으로 첫 번째 배열을 순회하면서 같은 인덱스의 요소를 엄격한 동등 연산자(===)로 비교합니다.
3. 하나라도 다른 요소가 발견되면 즉시 false를 반환하고, 끝까지 모두 일치하면 true를 반환합니다.

예제 코드

const arr1 = [1, 4, 5, 3, 5, 6];
const arr2 = [1, 4, 5, 2, 5, 6];

const areEqual = (first, second) => {
   // 길이가 다르면 비교할 필요 없이 false
   if(first.length !== second.length){
      return false;
   };
   // 같은 인덱스의 요소를 하나씩 비교
   for(let i = 0; i < first.length; i++){
      if(first[i] === second[i]){
         continue;
      }
      return false;
   };
   return true;
};

console.log(areEqual(arr1, arr2));

실행 결과

위 코드를 콘솔에서 실행하면 아래와 같은 결과가 출력됩니다.

false

arr1과 arr2는 네 번째 요소에서 3과 2로 서로 다르기 때문에 최종적으로 false가 출력됩니다.

추가 팁: JSON.stringify 활용하기

요소의 순서까지 고려한 단순 비교라면 JSON.stringify()를 이용해 더 짧게 구현할 수도 있습니다.

const areEqualSimple = (a, b) =>
  a.length === b.length && JSON.stringify(a) === JSON.stringify(b);

다만 이 방식은 중첩 객체나 undefined 값이 포함된 경우 예상과 다른 결과를 낼 수 있으므로, 원시값(primitive) 배열을 비교할 때 사용하는 것이 안전합니다.