객체

객체는 여러 자료형 중 하나이지만 복잡하고 이해하기 어렵기에 공부가 필요합니다.
원시 값을 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있는데 객체는 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 참조값에 접근하는 것이다. 이때 참조값은 생성된 객체가 저장된 메모리 공간의 주소 그 자체!
그림으로 이해하는 것이 좋지만 말로 설명할 수 있으면 좋을 것 같습니다.

object의 자료형은 메모리를 할당해주고 그 안에 값들을 주면 주소로 그 값을 만들어주는 것
ex) const obj = {
age = "10"
name = "park"
};
라는 박스를 만들었다면 그 안에 적히는 값들은 그 박스에 참조된 주소에 저장되는 것
이곳에 저장이 된다면 참조하는 방법 :
obj.age, obj.name
출력 : console.log(obj.name); //park

얕은 복사와 깊은 복사!

객체는 주소를 참조하는 것이기에 만약 객체를 복사한다면 문제가 생긴다
const obj = {
age = "10"
name = "park"
};

const copy = obj;
를 하게 되면 바라는 대로 obj의 값들도 복사된다. 하지만 copy.age나 copy.name값을 바꾸면
어떻게 될까?

copy.age = "30";
copy.name = "choi";

console.log(copy) // 30, choi
console.log(obj) // 30, choi

우리가 생각할 때는 obj는 그대로 있고 copy만 바껴야하는데 두 개가 다 바껴버렸다.

이유는 위에서 말한대로 객체는 참조된 주소값을 사용하기에 두 객체가 같은 주소를 공유하기에 그런 것!

이를 해결하기 위해 shallow copy와 deep copy 즉 얕은 복사와 깊은 복사가 있다

shallow copy 방법
1. 반복문으로 값을 받는다.
2. object.assign으로 받는다
3. {...obj}와 같은 전개연산자의 사용

위의 방법으로 하면 주소 값들을 다른 곳에 복사하여 사용하는 것이기에 각각의 값을 바꿔도 전체가 바뀔 일은 없어진다.
하지만 객체 안에 또 다른 객체가 포함되어 있다면 이번에도 처음과 같이 문제가 발생되는데 이렇기에 또다른 방법인 deep coy방법이 있다

deep copy 방법
1. 재귀함수를 이용한 반복으로 값을 받기
2. .JSON객체와 stringfy로 문자열로 변환 후 사용
 ->(문자열로 변환 시에 원본 객체와의 참조가 끊김)

표현이 어렵긴 하고 방법도 여러가지지만 왜 이런지 이해만 한다면 어렵지 않을 수 있는 객체에 대한 간단한 설명이었습니다.

가장 중요한 것은 객체는 메모리고 그 안의 값들은 참조된 주소에 저장한 값들이라는 것을 꼭 이해하고 넘어가는게 좋습니다.

profile
친화력 좋고 긍정적인 개발자입니다!

0개의 댓글