[JS] Primitive Type 과 Reference Type

Variable types

primitive type : number, string, boolean, null, undefined, symbol

reference type : object, array, function

 

1. primitive type

number, string, boolean, null, undefined, symbol

value자체를 메모리에 저장한다.

 

 

let age = 20;
let age2 = age;

console.log(age);  // 20
console.log(age2);  // 20

 

변수 age와 age2는 각각의 메모리 공간을 가지게 된다.

변수 age2의 메모리 공간에 변수 age의 값을 복사해서 가져오게 된다.

age와 age2를 console에 출력해보면 둘 다 20이 출력된다.

 

let age = 20;
let age2 = age;

age2 = 3;

console.log(age);  // 20
console.log(age2);  // 30

 

변수 age2의 값을 30으로 재할당하게 되면

age2 메모리 공간의 값이 30으로 업데이트된다.

age와 age2를 console에 출력해보면 age는 20이, age2는 30이 출력된다.

age와 age2는 각각의 메모리 공간을 사용하기 때문에

age2의 값을 변경하더라도 age에는 전혀 영향을 주지 않는다.

 

 

2. reference type

object, array, function 등...

value를 가리키는 reference를 메모리에 저장한다.

 

 

const obj = {
  name: 'eunji',
  age: 20,
};

console.log(obj.name);  // eunji

 

변수 eunji는 메모리 공간에 object의 reference를 저장하고,

메모리에 저장된 주소가 가리키는 곳에서 name의 Property의 value를 출력한다.

 

 

 

 

const obj = {
  name: 'eunji',
  age: 20,
};

const obj2 = obj;

console.log(obj2.name);  // eunji

 

obj가 갖고 있던 주소 값이 obj2에 복사되어 저장된다.

obj와 obj2는 같은 것을 가리키게 되고,

obj2 name의 값은 obj name의 값과 동일한 값을 출력한다.

 

 

 

 

const obj = {
  name: 'eunji',
  age: 20,
};

const obj2 = obj;

obj.name = 'suji';

console.log(obj.name);  // suji
console.log(obj2.name);  // suji

 

obj name의 값을 suji로 변경하면

obj와 obj2 모두 name의 값이 suji로 변경된다.

obj와 obj2가 가리키고 있는 object가 동일하기 때문에 어떤 것을 통해서 업데이트해도 둘 다 변경된다.

 

 

 

---

내용 출처 : 드림 코딩 by 엘리

본 포스팅은 개인 공부를 목적으로 기록한 글입니다.