Pass by value vs Pass by reference
✏️

Pass by value vs Pass by reference

Description
value로 사용될때와 reference로 사용 될때의 차이
Tags
Published
Published April 18, 2020

Pass by value

자바스크립트에서 원시 타입 (Primitive type)은 값 그 자체로 전달된다. 원시 타입은 값이 한번 정해지면 변경할 수 없다(immutable). 값은 런타임(변수 할당 시점)에 메모리 스택 영역에 고정된 메모리 영역에 할당된다.
let a = 1; const b = a; console.log(`${a} ${b}`); // 1 1 console.log(a === b); // true a = 2; console.log(`${a} ${b}`); // 2 1 console.log(a === b); // false
a에 primitive type인 숫자를 할당했다.
b에는 a를 할당하는데 할당하려는 a가 primitive type 이므로 1 그 값 자체가 복사된다.
 

Pass by reference

Primitive type이 아닌 Object타입은 연산이 실제 값이 아닌 참조값으로 처리된다. Object 타입은 프로퍼티를 추가, 제거, 변경이 가능한 mutable한 값이다. 따라서 동적으로 변할 수 있는 객체 타입은 런타임에 메모리 공간을 확보하고 메모리의 힙영역에 저장된다.
let obj = { a: 1, }; let obj2 = obj; console.log(obj.a, obj2.a); // 1 1 obj.a = 10; console.log(obj); // {a: 10} console.log(obj2); // {a: 10} console.log(obj === obj2); // true
객체 리터럴 방식으로 객체를 생성하고 obj변수에 할당하였다. 여기서 중요한것은 obj라는 변수에는 실제 { a: 1 } 라는 값(value)이 아닌 참조값(address)이 할당 된다는것이다.
따라서 obj2 변수에 obj 객체를 할당하면 obj2는 obj의 참조값이 할당된다.
즉, 두 변수(객체) 모두 같은 참조값을 보고있어 obj객체의 값을 변경하였지만 같은 참조값을 가지고 있는 obj2의 프로퍼티 값도 변경 (실제로는 힙 메모리에 있는 하나의 프로퍼티값 이지만) 된다.
그럼 다음과 같은 경우는 어떨까?
notion image
 
let obj = { a: 1, }; let obj2 = { a: 1, }; console.log(obj, obj2); // {a: 1} {a: 1} console.log(obj === obj2); // false obj.a = 10; console.log(obj, obj2); // {a: 10} {a: 1} console.log(obj === obj2); // false
obj와 obj2의 프로퍼티 값은 같지만 객테 리터럴을 통해 각각 별개의 객체가 생성되고 참조값이 할당되었다. 즉, obj와 obj2의 어드레스는 같지 않다.
따라서 obj의 프로퍼티를 변경하더라도 별개의 객체이기때문에 obj2객체는 영향을 받지 않는다.
notion image