Primitive & Reference Data Type에 대해 포스팅하겠습니다.
Primitive Data Type이란, 변수에 그 값을 넣어주는 것이고
Reference Data Type이란, 변수가 값이 저장된 메모리를 참조하는 것입니다.
JavaScript에서
Primitive Data Type의 종류는 Number, Boolean, String, Symbol, null, undefined등이 있고
Reference Data Type의 종류는 Object가 있습니다.
//Primitive Data Type Example
let originalValue = 100;
let newValue = originalValue;
위와 같은 경우를 그림으로 표현하면 다음과 같습니다.
originalValue -> 100
newValue <-------┘
그리고 originalValue에 새로운 값을 저장하게 되면
originalValue = 200;
originalValue <- 200
newValue <----- 100
그렇다면 Reference Data Type에 대해 알아보겠습니다.
//Reference Data Type Example
let originalArray = [1,2,3,4];
let newArray = originalArray;
위와 같은 경우를 그림으로 표현하면 다음과 같습니다.
originalArray -> (0x10) -> [1,2,3,4]
newArray <--------┘
[1,2,3,4]라는 배열을 담고있는 주소(0x10)를 참조(reference)하는 형태입니다.
그리고 originalValue[0]의 값을 바꾸면 다음과 같습니다.
originalArray[0] = 100;
originalArray -> (0x10) -> [100,2,3,4]
newArray <--------┘
그러므로, newArray[0]를 호출하게 되면
console.log(newArray[0]) // 100
이 개념에 대해 알아보는 예제를 살펴보겠습니다.
let profile = {
name: "김개발",
address: {
home: "한강아파트",
company: "위워크 선릉2호점"
},
hobby: "programming"
}
위와 같은 객체가 있고
addProperty
라는 function이 있습니다.
이 function은 info라는 객체를 받아 profile에 merge합니다.
예를 들어
let newProfile = addProperty({ age: 20 });
//newProfile
{
name: "김개발",
address: {
home: "한강아파트",
company: "위워크 선릉2호점"
},
hobby: "programming",
age: 20
}
위와 같은 결과가 나와야합니다.
이를 해결하기 위해서 필요한 개념은 2가지입니다.
1. 참고를 끊고 값을 복사하는 방법
2. 객체를 merge하는 방법
위 둘을 활용해서 addProperty
를 구현하면 다음과 같습니다.
let clone = obj => {
let clonedObj = {};
for(let key in obj){
clonedObj[key] = obj[key];
}
return clonedObj;
}
const addProperty = info => {
let clonedProfile = clone(profile);
return {...clonedProfile, ...info};
}
clone
이라는 function을 만들어 참조를 끊고 값을 복사했고
{...obj1, ...ob2}문법을 확용해 객체를 merge했습니다.