Skip to content

Latest commit

 

History

History
141 lines (101 loc) · 5.27 KB

dataType.md

File metadata and controls

141 lines (101 loc) · 5.27 KB

DataType

  • 자바스크립트가 데이터를 처리하는 과정을 보자

데이터 타입의 종류

타입에는 크게 두가지가 있다. 원시형 타입과 참조형 타입 두가지로 나뉜다.

  • 원시형 : number | string | boolean | null | undefined | symbol
  • 참조형 : Object | Array | Function | Data | RegExp
  • stackMemory : 참조형 데이터 | 동적할당
  • heapMemory : 변수 | 기본형 데이터 | 정적할당
var a; //1003번에 저장
a = 'abc'; //5004번에 저장하고 1003주소에서 값@5004
a = 'abcdef'; //5005번에 저장 1003주소에서 값 @5005

데이터 할당 흐름 (편의상 변수 영역과 데이터 영역으로 구분)

1. 변수영역에서 빈 공간(@1003)을 확보
2. 확보한 공간의 식별자를 a로 지정
3. 데이터 영역의 빈 공간 (@5004)에 문자열 'abc'를 저장
4. 변수 영역에서 a라는 식별자를 검색
5. 앞서 저장한 문자열의 주소(@5004)를 @1003 공간에 대입
6. 데이터 영역에서 문자열 'abcdef'를 저장
7. 변수 영역에서 a라는 식별자를 검색
8. 앞서 저장한 문자열의 주소(@5005)를 @1003 공간에 대입

var obj = {
  a: 1,
  b: 'bbb',
};

var obj;
obj = {
  a: 1,
  b: 'bbb',
};
obj.2

데이터 할당 흐름 (편의상 변수 영역, 객체의 뱐수영역, 데이터 영역으로 구분)

1. 변수영역에서 빈 공간(@1002)을 확보하고 그 주소의 이름을 obj로 지정
2. 임의의 저장공간(@5001)에는 프로퍼티들을 저장하기위해 별도의 변수영역을 마련하고 그영역의 주소(@7103 ~ ?)를 @5001에 저장
3. @7103 및 @7104에 각각 a와 b에 프로퍼티 이름을 지정
4. 데이터 영역에서 숫자 1을 검색
5. 검색결과가 없기때문에 데이터 영역의 @5003에 저장하고, 주소(@5003)을 @7103에 저장 'bbb'역시 마찬가지로 @5004에 저장하고, 주소(@5004)를 @7104에 저장
6. 데이터 영역에서 숫자 2를 검색, 검색 결과가 없기 때문에 데이터 영역의 @5005에 저장하고, 주소(@5005)를 @7103에 저장

var obj = {
  x: 3,
  arr: [3, 4],
};

데이터 할당 흐름 (편의상 변수 영역, 객체의 변수영역, 배열의 변수영역, 데이터 영역으로 구분)

1. 변수영역에서 빈 공간(@1002)을 확보하고 그 주소의 이름을 obj로 지정
2. 임의의 저장공간(@5001)에는 프로퍼티들을 저장하기위해 별도의 변수영역을 마련하고 그영역의 주소(@7103 ~ ?)를 @5001에 저장
3. @7103 및 7104에 이름 x와 이름 arr 지정
4. 데이터 영역에서 숫자 3을 검색
5. 검색결과가 없기때문에 데이터 영역의 @5002에 저장하고, 주소(@5002)을 @7103에 저장
6. @7104에 저장할 값은 배열로 데이터 그룹. 이 그룹 내부의 프로퍼티들을 저장하기 위해 별도의 변수 영역(@8104 ~ ?)를 마련하고, 그 주소정보를 @5003에 저장하고 @5003을 @7104에 저장
7. 배열의 요소가 총 3개이므로 3개의 변수 공간을 확봉하고 각각의 인덱스를 부여한다.
8. 배열의 변수영역 @8104에 이름을 0 값을 @5002 | @8105에 이름을 1 값을 @5004 | @8106에 이름을 2 값을 @5005로 저장

obj.arr[1]을 검색할때 메모리에서 흐름

@1002 -> @5001 -> (@7103 ~ ?) -> @7104 -> @5003 -> (@8104 ~ ?) -> @8105 -> @5004 -> 4반환

값을 직접 저장하는 방식 vs 값의 주소를 저장하는 방식

30바이트가 넘는 문자열을 기준으로

  • 30 * x byte
  • 30 + x byte

직접저장

  • 데이터 할당시에는 빠름
  • 비교에 비용이 많이 듦
  • 메모리 낭비가 심함

주소를 저장

  • 데이터 할당시에는 느림
  • 비교에 비용이 들지 않음 => 같은 값이 오직 하나만 존재 => 불변값 => 기본형 데이터가 불변값인 이유
  • 메모리 낭비 최소화

기본형 vs 참조형

  • 기본형은 주소값을 복사하는 과정이 한번만 이뤄지고, 참조형은 한단계를 더 거치게 된다.

참조형 데이터의 가변

  • 가변은 데이터 자체가 아닌 내부 프로퍼티를 변경할때만 성립

불변 객체를 만드는 방법

관련 코드

얕은 복사

  • 바로 아래 단계의 값만 복사 (예제의 copyObject function)
  • 중첩 객체에서 참조형 데이터가 저장된 프로퍼티를 복사할때 그 주소값만 복사

깊은 복사

  • 내부의 모든 값들을 하나하나 찾아서 전부 복사

객체를 복사해서 내부의 모든 값을 복사해 새로운 데이터를 만들고자 할때

  • 기본형 데이터일 경우에는 그대로 복사하면 OK
  • 참조형 데이터는 다시 그 내부의 프로퍼티를 복사해야함

undefined 와 null

관련 코드

undefined를 반환하는 3가지 경우

  • 값을 대입하지 않은 변수, 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할때
  • 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할때
  • return 문이 없거나 호출되지 않는 함수의 실행 결과

null

  • 비어있음을 명시적으로 나타내고 싶을 때 사용
  • type은 Object 이다.