JS중급_OOP, data type

▶️ primitive/reference data type

var name = 'Kim'
var age = 20;

자바스크립트의 자료형은 크게 2개로 분류한다.

• primitive data : 자료 자체가 변수에 저장됨(문자, 숫자 자료형)
• reference data type : 자료 자체가 아닌 레퍼런스를 자료에 저장

---

▶️ Reference data type

	var obj = { name : 'Kim' };

오브젝트는 대표적인 reference 자료형이다.

• 이 경우 "{ name : 'Kim' }"을 obj라는 변수에 직접 저장한 것이 아니고, 객체가 저장돼있는 메모리 주소를 저장한 것이다.

var obj1 = {name : "kim"};
var obj2 = obj1;  
console.log(obj1);  // {name: 'kim'}
console.log(obj2);  // {name: 'kim'}

obj1.name = 'park';

console.log(obj1);  // {name: 'park'}
console.log(obj2);  // {name: 'park'}

메모리 주소를 복사해오는 것이기에 obj2는 값을 변경한 적이 없지만 위처럼 {name : park} 을 불러오는 것을 볼 수 있다. 즉 메모리에 있는 같은 데이터를 공유하는 것이다.

• 위같은 복사가 싫으면 constructor 문법을 사용한다.

---

▶️ 두 오브젝트 비교하기

var obj1 = {name : 'KIM'};
var obj2 = {name : 'KIM'};

obj1 == obj2 // false 

위처럼 비교시 false가 뜨는데, 이는 두 객체의 내용물은 똑같지만, 다른 메모리 주소(레퍼런스)를 갖기 때문이다. 중괄호를 새로 할당할 때마다 새로운 레퍼런스주소가 생긴다고 보면 된다.

---

▶️ 함수를 통해 오브젝트를 변경하기

var testObj = {name : 'Kim'};

function changeObj(obj) {
    obj.name = 'garden';  //  object 값을 변경
}

changeObj(testObj); 
console.log(testObj);//{name : 'garden'}

var testObj = {name : 'Kim'};

function changeObj(obj) {
    obj = {name : 'garden'};  //  object 값을 '할당'
	return obj;
}

changeObj(testObj); 
console.log(testObj);//{name : 'kim,'}
console.log(change2())//{name : 'garden'}

• object 값을 변경할때는 정상적으로 변경되지만, 할당할 경우 변경에 실패하는 것을 알 수 있다.
• 이는 함수의 파라미터의 특징때문에 발생하는데, parameter는 일종의 변수처럼 생성되고 사라지는 존재라고 생각하면 된다. (쉽게 말해서, parameter는 일종의 var 변수이다.)

var nameTag = {name : 'Kim'};

function changeName(obj) {
    obj ={name : 'park'}  
}

changeName(var obj = nameTag); // 변경O

한 번 더 설명하자면, nameTag와 changeName의 obj 파라미터가 동일한 메모리 주소룰 참조했기 때문에, 그래서 object값 변경에 성공한 것이다.

var nameTag = {name : 'Kim'};

function changeName(obj) {
    obj ={name : 'park'}  
}

changeName(NameTag); // 변경 X

반대로 이 경우 새로운 메모리 주소를 할당한 것이기 때문에 서로 다른 메모리 주소를 가진 객체가 생성되는 것이다. 즉 값이 변경되지 않고 그대로 유지된다.

---