Chapter 01_JS 데이터_08. 불변성

이소연·2022년 9월 13일
0

JavaScript Essentials

목록 보기
17/22

js의 데이터 불변성(Immutability)에 대해 살펴본다.
js의 데이터는 크게 두가지 개념으로 분리할 수 있는데, 첫번재는 원시 데이터, 두번째는 참조형 데이터.

원시 데이터란 js에서 사용할 수 있는 기본 데이터라는 뜻.

  • String
  • Number
  • Boolean
  • undefined
  • null

참조형 데이터

  • Object
  • Array
  • Function - (콜백형태로 함수도 데이터처럼 인수 안에 들어가기 때문에)



a변수가 첫번째 메모리에 저장되고, b변수는 두번째 메모리에 저장됨. 따라서 a와 b는 일치하지 않음. 서로 다른 값이어서 false가 나온게 아니라 메모리의 주소가 다르기 때문에 그런 것.

근데 b에 a를 할당하면 a가 바라보는 1번 메모리를 b에게 할당하는 것. 따라서 b는 첫번째 메모리를 바라보게 됨.
그래서 출력값을 보면 데이터 값도 똑같아지고 비교 연산자로 비교해보면 true값이 나옴.

a에 숫자 데이터 7을 할당하면 새로운 데이터이기 때문에 세번재 메모리에 들어가게 됨. a는 1번 메모리가 아니라 3번 메모리를 바라보게 됨. 따라서 비교해보면 a는 세번째 메모리, b는 첫번째 메모리로 서로 바라보는 주소가 다르기 때문에 false가 나옴

새로 선언된 변수 c는 1이 할당되어있는데, 그 숫자데이터는 네번째 메모리에 들어가는게 아님.
c는 기존의 첫번째 메모리에 있는 데이터 1을 바라보게 됨. 따라서 일치연산자도 true가 나옴.

바로 여기서 데이터 불변성이 나온다. 새로운 원시데이터를 만들 때 그 값이 기존의 메모리 주소에 들어있다면 새로운 메모리에 만드는게 아니라 기존의 메모리 주소를 바라보도록 만들어짐. 따라서 한번 만들어지면 원시 데이터는 항상 불변한다. 이를 js에서 데이터 불변성이라고 부른다. 기존의 데이터는 변하지 않는다는 뜻.

원시데이터를 취급할 때는 메모리까지 동원하면서 이해할 필요는 없음. 생긴거랑 결과값이 같기 때문에. 근데 참조형 데이터를 이해하기 위해서 데이터 불변성을 배운 것. 그렇다면 참조형 데이터는 어떻게 메모리를 참조해서 사용하는가?




참조형 데이터 중 객체 데이터를 통해 알아본다.

a와 b를 비교했을 때 생김새는 똑같은데 일치 연산자로 false값이 나옴. 결국 다른 메모리 주소를 바라보고 있다는 것. a는 1번 메모리를 바라보고 있고 b는 2번 메모리를 바라보고 있음.

참조형 데이터는 원시형 데이터와 다르게 새로운 데이터를 만들 때마다 새로운 메모리 주소에 할당되는 구조를 가지고 있음. 따라서 생김새가 같아도 같은 주소가 아닐 수 있음. 즉 참조형 데이터는 불변성이 없다. 다른 말로 가변한다고도 함.

∴ 참조형 데이터는 불변하지 않기 때문에 선언할 때마다 새로운 메모리 주소에 데이터가 할당됨.

a의 k를 7로 수정했다.
그리고 b에다가 a변수를 다시 할당함. 그럼 b는원래 2번 메모리 주소였는데, 1번 메모리주소를 바라보게 바뀜. 그래서 다시 출력해보면 b에도 k:7인 객체 데이터가 출력되고 비교해봐도 둘다 1번 메모리 값을 바라보고 있기 때문에 true값이 나옴.

그 아래에서 a의 k를 다시 2로 수정했음. 그럼 1번 메모리의 값이 7에서 2로 바뀜. 그리고 위의 코드에서 b도 같은 메모리를 바라보고 있기 때문에 콘솔을 보면 a,b 모두 K:2로 바뀌어있음. true값도 나옴.

주의해야 할점이 나오는데, 같은 메모리를 바라보는 여러 변수들이 있을 때 한쪽의 변수값을 수정하면 다른값에서 확인할 때 의도하지 않게 값이 바뀌어져있을 수 있음.

c라는 변수에 b를 할당함.
그럼 a도 1번 메모리 주소, b도 1번 메모리 주소, c도 1번 메모리 주소를 갖게됨.
그래서 출력해보면 모두 k:2값이 나오고 true나옴.

그리고 마지막으로 a의 k에 9를 할당함. 그럼 1번 메모리주소의 k는 9가되고 b,c도 모두 마찬가지.

참조형 데이터는 할당연산자를 사용할 때 a의 데이터를 복사하는 개념이아니고 단순하게 메모리의 참조 주소만 같은 곳을 바라보게 해주는 것. 따라서 b에 a를 할당했을 때 b를 수정해도 a가 수정되고 a를 수정해도 b가 수정되는 것.

∴그래서 같은 메모리를 바라보게 할 목적이 아니라면 데이터를 복사만 해야하는데, 얕은 복사와 깊은 복사가 있음.
참조형 데이터를 관리할 때에는 할당 연산자를 쓰는것이 의도치 않은 문제를 발생시킬 수 있기 때문에 일반적으로 복사라는 개념을 통해 a와 b를 메모리상에서 분리해줘야 함.

profile
프론트엔드 종합반 강의 공부 블로그

0개의 댓글

관련 채용 정보