자바스크립트에서 변수가 선언이 되면 stack메모리에 식별자가 저장이되고 할당되는 값에따라 데이터타입이 결정된다.
💡자바스크립트 메모리영역💡
* 메모리에는 각각의 셀에 주소가 부여되어 있다 *
stack : 함수나 메서드의 지역변수 , 매개변소가 저장된다. 함수나 메서드가 호출될때마다 스텍프레임이 쌓임
heap: 객체가 저장됨
✅ 데이터타입 구분
▶️ 기본형 : 불변
숫자, 문자형, boolean, null, undefined, symbol
symbol(ES6)이란?
- 원래 객체 프로퍼티는 데이터타입은 문자형이다
(숫자나 불리언이어도 Object.keys(obj)로 빼면 문자형배열로 반환됨)- 문자형외, 또한가지 데이터타입으로 반환가능한데, 그것이 symbol형
- 유일성이 보장되므로(전체의코드중 딱하나) 유일한 식별자를 만들때 사용
▶️ 참조형 : 가변
객체_배열,함수,날짜,정규표현식,Map,WeakMap,Set,WeakSet
✅ 메모리에 변수저장
기본형과 참조형은 메모리 상에서 저장되는 형태가 다르다.
▶️ 기본형
/// 예시코드
let a='abc'1. 자바스크립트에서 변수를 선언하면 메모리 안에서 데이터가 담길 공간(셀)을 미니 확보
2. 확보한 공간의 이름에 식별자를 지정 ( 이때 값은 undefined )
3. 값을 할당하는 코드를 만나면 해당 값을 데이터가 들어있는 메모리 영역에 있는지 검색.
4. 없다면 해당 값을 비어있는 메모리공간에 저장.
( 만약 값이 이미 다른 메모리공간에 있을때는 새로운 메모리공간에 또 저장하는것이 아니고 있는 메모리공간을 재사용을함.)
5. 값이 들어있는 공간의 주소를 들고 변수가 가리키는 주소로이동 (현재 컴퓨터는 변수 a 가 어디있는지 모르는상태)
6. 변수들이 저장되어 있는 stack메모리로 가서 값이 공간들을 검색하다가 식별자가 변수와 같은 공간에가서 값을 들고간 주소로 지정
▶️ 참조형
기본형처럼 참조형역시 변수를 선언하고 할당한다. 하지만 기본형은 선언과 할당이 동시에 일어나는 반면, 참조형은 선언이 먼저 이루어지고 그 후에 할당이 이루어진다.
/// 예시코드
let obj={
a:1,
b:'bbb'}1. 자바스크립트에서 변수를 선언하면 메모리 안에서 데이터가 담길 공간(셀)을 미니 확보
2. 확보한 공간의 이름에 식별자를 지정 ( 이때 값은 undefined )
3. 할당된 값을 빈 데이터메모리공간에 저장하려고 보니 여러개의 프로퍼티로 이루어진 데이터그룹이다. 메모리구조 공간에는 값이 하나씩 밖에 못들어가기 때문에 한 공간에 모든 데이터를 넣을 수 없다.
>>> 여기서 부터 한단계가 늘어남
4. 내부 프로퍼티들을 저장하기 위해 별도의 변수 영역을 확보
5. 확보한 영역의 주소를 데이터 메모리 공간에 저장 (확보한 공간이 모두 이 객체의 프로퍼티야~ 라고 지정을 하는 것)
6. 확보한 영역에 프로퍼티 값들을 저장.
7. 프로퍼티에대한 선언과 할당은 기본형과 같음
8. 객체안의 프로퍼티가 모두 할당이 되면 확보된 공간을 가리키는 메모리주소를들고 식별자가 들어있는 메모리주소에 할당
[전체 프로세스]
✅ 변수의 값 변경
▶️ 기본형
지정된 주소에 들어있는 값을 바꾸는것이 아닌(불변성) 또다른 주소에 바뀔값을 저장-> 그 다른 주소값을 들고 다시 변수가 가리키는 주소로 이동-> 변수메모리공간(stack)들을 검색하다가 식별자와 변수가 같은 공간에가서 값을 들고간 주소로 변경
▶️ 참조형
바꿀값을 새로운 메모리주소에 저장 (혹은 이미 저장되 있는 값이 있는지 검색) -> 데이터의 주소값을들고 -> 일단 obj를 찾아감 -> 값이 참조하고있는 주소값을 찾아감 -> 그 주소에서 확보한 공간의 주소값으로 감 -> 거기서 해당프로퍼티를 찾음 -> 값을 자신의 주소로 바꿔치기
👉 여기서 프로퍼티의 값의 주소는 바뀌지만 식별자(obj)의 값의 주소는 바뀌지 않는데 이는 기본형과 다르게 참조형은 메모리할당과정에 1단계를 더 거치기 때문이다.
[전체 프로세스]
🔥 여기서 잠깐🔥
✔️ 그럼 그 전의 값이 들어있는 공간은 어떻게 되느냐?
👉 아무도 참조를 하고 있지 않은상태, 참조를 하고 있는대상이 0인상황(참조카운트가 0이다라고 표현한다)
이런 메모리는 Garbage Collector, 줄여서 GC의 수집대상이 되어 자연스럽게 사라진다.
✔️ 데이터 메모리에 이미 할당될 값이 있는 경우?
👉 새로운 메모리공간에 또 저장하는것이 아니고 있는 메모리공간을 재사용함.
✔️ 만약에 재할당 하려는 값이 전의 값과 데이터타입이 다를경우?
👉 똑같다. 일단 빈 메모리공간에 바뀔 데이터를 저장, 주소를 들고 식별자를 찾고 값에있는 메모리주소를 찾아가서 , 확보된 공간에 가서 해당 변수를 찾아서 주소값을 바꿔준다.
✔️ 만약에 재할당 하려는 값이 전의 값과 데이터타입이 다를경우?
👉 똑같다. 일단 빈 메모리공간에 바뀔 데이터를 저장, 주소를 들고 식별자를 찾고 값에있는 메모리주소를 찾아가서 , 확보된 공간에 가서 해당 변수를 찾아서 주소값을 바꿔준다.
✔️ 그렇다면 중첩객체는?? (프로퍼티의 값이 배열일 때)
👉 모든 과정이 같지만 프로퍼티의 값을 저장하는 과정에서 다시한번 공간을 확보하고 이름에 인덱스, 값은 빈메모리공간에 저장하고 주소를 가져옴
✔️ 값에 데이터를 바로 넣지 않고 다른 메모리 공간에 저장한 후 메모리주소를 넣는이유??
👉 컴퓨터는 데이터를컴퓨터가 이해할 수 있는 이진법숫자들로 전환한 다음에 메모리에 저장하게 된다.
만약 굉장히 큰 용량을 차지하는 문자열을 이진법으로 저장하게되면 굉장히 길어진다.
처음에 값을 할당하는 경우에는 문제가 생기지 않지만, 나중에 값을 비교하는 상황이 오면 컴퓨터는 굉장히 긴 이진법을 하나하나 쭉 비교를 하게되며 이는 성능저하와 메모리 낭비를 야기한다.
심지어 같은 값을 가지고 있는 프로퍼티가 많아지게 된다면 성능은 더더욱 저하될 것이다.
반면, 한 메모리공간에 저장을해두고 주소값만 가져온다면
처음에 할당시 같은 값이 있는지 찾을때는 시간이 좀 걸리지만
한번 같은 주소값을 사용한다는것이 결정되고나면 똑같은 주소를 보고있다는것은 당연히 같은 값이라는 것이기 때문에 이후 비교를 하는과정이 훨씬 효율적이게된다. + 메모리도 훨씬 덜 차지
