javascript
[javascript] 참조 타입의 특성 - 객체 값 참조
20대 청년
2020. 5. 21. 22:25
자바스크립트 참조 타입의 특성
기본 타입과는 다르게 참조 타입은 값을 변수에 넣어주는 것이 아니라 값을 참조하는 것이다.
참조한다는 것이 처음에는 어떤 느낌인지 정확히 이해를 하지 못합니다.
예를 들어서 쉽게 표현 해보도록 해보겠습니다.
var objA = {
value: 40
};
var objB = objA;
console.log(objA.value); // 40 (출력)
console.log(objB.value); // 40 (출력)
objB.value = 50;
console.log(objA.value) // 50 (출력)
console.log(objB.value) // 50 (출력)
위와 같이 objA 변수와 objB 변수가 동일한
객체를 가르키는 참조값을 가지게 되어서 같은 값을 출력하는 것을 알 수 있다.
이처럼 아주 간단하고 기초적인 지식이지만, 자바스크립트를 사용한다면 꼭 알아야 하는 지식이라고 생각합니다.
그럼 이제 객체끼리 비교를 해볼까요?
var objA = { value: 50 };
var objB = { value: 50 };
var objC = objB
console.log(objA.value === objB.value) // false
console.log(objB === objC) //true
값을 본다면 objA.value (50) 와 objB.value(50) 가 같습니다.
하지만 비교 연산자를 사용했는데 false를 반환했습니다.
객체는 참조 타입입니다. 참조값이 같아야 true를 반환하는 것을 알 수 있습니다.
참조값이 다르면 아무리 값이 같아도 참조 타입에서는 같은 결과로 반환이 되지 않습니다.
이번엔 함수안에서 참조 값을 호출한다면 어떻게 값이 변할까요?
var objA = { value : 50 };
function changeObjA(obj){
obj.value = 100;
console.log(obj); // 출력 { value : 100 }
}
changeObjA(objA);
console.log(objA.value) // 100 (출력)
함수 안에서 객체 참조 값을 바꿔주니 밖에서도 참조 값이 바뀐 것으로 보입니다.
함수를 잘 활용하면 좋을 것 같습니다.