Jasmine.js에서 배열 비교하기: toBe와 toEqual의 차이 완벽 정리

Jasmine.js에서 배열을 비교하는 방법은 크게 두 가지입니다.

• 두 변수가 메모리상에서 동일한 배열 객체를 참조하는 경우
• 두 변수가 서로 다른 객체를 가리키지만, 그 내용이 모두 같은 경우

1. toBe() — 참조(reference) 비교

첫 번째 경우에는 toBe() 메서드를 사용합니다. 이 메서드는 객체의 참조가 같은지, 즉 메모리상에서 같은 객체를 가리키는지만 확인합니다.

예제

describe("Array Equality", () => {
    it("should check for array reference equality", () => {
        let arr = [1, 2, 3];
        let arr2 = arr;
        // 성공 — arr과 arr2는 같은 객체를 참조
        expect(arr).toBe(arr2);
        // 실패 — 내용은 같아도 참조가 다름
        expect(arr).toBe([1, 2, 3]);
    });
});

실행 결과

Array Equality should check for array equality
Message:
    Expected [ 1, 2, 3 ] to be [ 1, 2, 3 ]. Tip: To check for deep equality, use .toEqual() instead of .toBe().

위 결과에서 볼 수 있듯이, [1, 2, 3]이라는 새로운 배열 리터럴은 기존 arr와 내용은 같지만 서로 다른 객체이기 때문에 테스트가 실패합니다. 실패 메시지에서도 힌트를 제공하며, 깊은 비교가 필요하면 .toEqual()을 사용하라고 안내합니다.

2. toEqual() — 깊은 비교(deep comparison)

두 번째 경우에는 toEqual() 메서드를 사용합니다. 이 메서드는 객체의 참조 여부와 상관없이 배열의 요소 하나하나를 재귀적으로 비교하여 내용이 같은지 검사합니다.

예제

describe("Array Equality", () => {
    it("should check for array content equality", () => {
        let arr = [1, 2, 3];
        let arr2 = arr;
        // 성공 — 같은 객체를 참조하므로 내용도 같음
        expect(arr).toEqual(arr2);
        // 성공 — 내용이 동일하므로 통과
        expect(arr).toEqual([1, 2, 3]);
    });
});

실행 결과

1 spec, 0 failures

모든 테스트가 통과했습니다. toEqual()은 참조가 달라도 내용만 일치하면 성공으로 처리하기 때문입니다.

정리

• toBe(): 자바스크립트의 === 연산자처럼 동작하며, 두 값이 완전히 동일한 객체(참조)인지 확인할 때 사용합니다.
• toEqual(): 객체나 배열의 내용을 깊게 비교하여 구조와 값이 같은지 확인할 때 사용합니다.

따라서 원시값(primitive)의 동일성을 검사할 때는 toBe()를, 배열이나 객체처럼 내용 기반의 비교가 필요할 때는 toEqual()을 사용하는 것이 올바른 선택입니다.