본문으로 바로가기

참조타입의 특성

category JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:15


참조 타입


자바스크립트에서 기본타입 5가지를 제외한 모든 값은 객체입니다.

배열이나 함수또한 객체로 취급됩니다.

이러한 객체는 자바스크립트에서 참조 타입이라고 부릅니다.

이것은 객체의 모든 연산이 실제 값이 아닌 참조값으로 처리되기 때문입니다.

기본타입은 직접 값을 가지고 있는 반면에 참조타입은 직접 값을 가지고 있지 않고 참조하는 객체에 번지를 가지고 있습니다.










■ 스택(Stack) 영역

 - 함수 호출, 변수 생성시 생성되는 지역 변수와 매개 변수가 저장되는 영역

 - 함수 호출이 완료되면 사라진다.



다시말해서, 스택영역에는 기본적으로 변수들이 생성이 되는 영역입니다.




■ 힙(Heap) 영역

- 필요에 의해 동적으로 메모리를 할당할 때 사용

- 객체/배열에 저장되는 영역

- 사용되지 않는 객체는 GC(가비지 컬렉터)가 자동으로 제거해 주는 영역




기본 타입 변수는 스택영역에 변수 선언과 동시에 초기화를 하게 되면 변수와 변수값이 스택영역에 저장되고

참조 타입 변수는 스택영역에 변수를 선언한 것이 생성,저장이 되지만 변수에 저장된 참조타입인 객체는 스택 영역에 저장되는 것이 아니라 heap 영역에 생성이 되고 heap 영역에 생성된 번지가 참조 변수의 값으로 들어가게 됩니다.

즉, 참조 변수는 메모리 주소에 있는 객체를 이용할 때 사용이 됩니다.




다음의 예제를 살펴보겠습니다.


// 기본 타입과 참조 타입의 비교 연산


// 기본 타입의 비교 연산
var a = 10;
var b = 10;
console.log( a == b ); // true;

// 참조 타입인 객체의 비교 연산
var objA = { value : 20 };
var objB = { value : 20 };
console.log( objA == objB ); // false;



위의 코드처럼 동등연산자(==)를 이용해서 비교 연산을 해보니 기본 타입은 true를 참조타입인 객체는 false를 출력하는 것을 알수 있습니다.

그 이유는 기본 타입의 경우는 값 자체를 비교해서 일치 여부를 판단하지만, 객체와 같은 참조 타입의 경우는 참조값이 같아야 true를 반환합니다.

참조란 객체의 실제 위치를 가리키는 포인터(pointer)입니다. 이 말인 즉슨 위 코드상에서 objA와 objB가 가리키는 위치, 즉 번지수가  다르기 때문에 false가 출력된 것입니다. 

객체 리터럴 표현방식으로 {}를 생성하여 변수 objA에 참조하였고, 또 다른 {}를 생성하여 변수 objB에 참조하였습니다.

이제부터는 객체를 담는 변수를 참조 변수라고 표현하도록 하겠습니다.

이렇듯 두 개의 참조변수는 프로퍼티와 값은 같지만 서로 다른 객체인 것이고 참조값이 같아야  true가 반환됩니다.




다음의 코드를 살펴보겠습니다.


// 참조 타입인 객체

var objC = { value : 'jaehee'};

// 참조변수 objC 를 변수 objD에 참조시킨다.
var objD = objC;
console.log( objC == objD ); // true;

위 코드에 객체 리터럴로 객체를 생성한 것은 하나이며, 참조 변수는 2개입니다.

하지만 참조변수들은 하나의 객체만을 포인터로 갖고 있습니다.

이렇듯 objC와 objD는 같은 객체를 가리키고 있기 때문에 동등연산자(==) 결과가 true가 되는 것이다.



[ 메모 ]
자바스크립트의 객체는 참조타입이며 값 비교가 아닌, 참조 비교를 수행한다.
객체는 자기 자신과는 동등하지만 다른 객체와는 동등하지 않다.
ex) 서로 다은 객체가 같은 수의 프로퍼티를 갖고 각 프로퍼티 이름과 값이 서로 같더라도 객체는 동등하지 않다
     마찬가지로 두 배열이 같은 순서로 같은 원소들을 가지고 있을지라도 두 배열은 동등하지 않다


Jaehee's WebClub