본문 바로가기

JavaScript/Basic-Javascript

자바스크립트 정리하며 배우기[10] - 참조(reference) 타입 비교(compare)

안녕하세요. Tay 입니다.

객체 간의 비교에 대해서 알아보겠습니다.

 

 

객체 비교

객체간의 비교를 할 때 참조값 으로 비교를 한다.

  • object 안에 property 를 비교하는 것이 아닌, object 의 값(참조값) 을 비교한다.
  • 같은 객체를 참조하는 것인지 주의 해야한다.

바로 예제를 통해서 알아보자.

 

1) index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <!-- <script src="reference.js"></script> -->
    <script src="compare.js"></script>
</body>
</html>

2) compare.js

compare.js

let a = 100;
let b = 100;

let objA = {value : 100};
let objB = {value : 100};

let objC = objB;

console.log(a == b);            // 1
console.log(objA == objB);      // 2

console.log(objB == objC);      // 3

 

  1. 기본 타입 a, b 를 비교한다.
  2. 객체 objA , objB 를 비교한다.
  3. 객체 objB , objC 를 비교한다.

위 세 비교문의 결과는 어떻게 출력 될까?

 

Github Commit

 

 

결과 :

compare 결과

  1. 기본 타입 a, b 를 비교한다.        - true
  2. 객체 objA , objB 를 비교한다.     - false
  3. 객체 objB , objC 를 비교한다.     - true

 

이유 :

compare.js

  1. a, b 는 기본타입이다. 즉, 원시 데이터 100 이라는 값을 가진 숫자형 변수 이다. 그렇기때문에 숫자 간 비교가 가능하다. 100 = 100 , 따라서 결과는 true 이다.
  2. objA 와 objB 는 객체이다. value 라는 프로퍼티에 원시데이터 100 을 갖고 있어도, 객체라서 참조값을 비교한다. 그렇기때문에 objA != objB , 따라서 결과는 false 이다.
  3. objC 에 objB 의 참조값을 할당했다. 따라서, 두 객체는 동일한 객체를 참조하고 있다.
    즉, 동일한 참조값을 가진다. objB = objC , 따라서 결과는 true 이다.

 

 

이 글은 개인 공부목적으로 작성되었습니다.

정보가 잘못 되거나 궁금한 사항은 댓글로 부탁드립니다!! 읽어주셔서 감사합니다.