Core Javascript 01 데이터 타입

Rachel·2022년 1월 14일
0

Core Javascript

목록 보기
1/8
post-thumbnail

01 데이터 타입

1-1 데이터 타입의 종류

  • 기본형 : 할당이나 연산시 값이 담긴 주솟값을 바로 복제한다. 기본형은 불변성(immutability)을 띈다.
    • 숫자 number
    • 문자열 string
    • 불리언 boolean
    • null
    • undefined
    • 심볼 symbol : 유일한 식별자(unique identifier)를 만들고 싶을 때 사용
  • 참조형 : 값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주솟값을 복제한다.
    • 객체 object
      • 배열 Array
      • 함수 Function
      • 날짜 Date
      • 정규표현식 RegExp
      • Map, WeakMap
      • Set, WeakSet

1-2 데이터 타입에 관한 배경지식

1-2-1 메모리와 데이터

  • 비트 : 0 또는 1만 표현할 수 있는 하나의 메모리 조각. 고유한 식별자를 통해 위치를 확인할 수 있다.
  • 바이트 : 8개의 비트로 구성되어 있다. 1바이트는 총 256(2^8)개의 값을 표현할 수 있다. 시작하는 비트의 식별자로 위치를 확인할 수 있다.
  • 모든 데이터는 바이트 단위의 식별자인 메모리 주솟값을 통해 서로 구분하고 연결할 수 있다.

1-2-2 식별자와 변수

  • 변수 : 변할 수 있는 데이터(숫자, 문자열, 객체, 배열 등등..)
  • 식별자 : 어떤 데이터를 식별하는 데 사용하는 이름, 즉 변수명.

1-3 변수 선언과 데이터 할당

1-3-1 변수 선언

var a; // 변할 수 있는 데이터를 만들고 이 데이터의 식별자는 a로 한다.
  • 변수란, 변경 가능한 데이터가 담길 수 있는 공간 또는 그릇
  • 이 공간의 이름(식별자)이 a

1-3-2 데이터 할당

  • 이렇게 값이 따로 저장된 이유는?
    • 데이터 변환을 자유롭게 할 수 있게 함과 동시에 메모리를 더욱 효율적으로 관리하기 위해

1-4 기본형 데이터와 참조형 데이터

1-4-1 불변값

  • 바꿀 수 있으면 변수, 바꿀 수 없으면 상수
    • 변수 영역 메모리를 바꿀 수 있는가?
    • 즉, 한 번 데이터 할당이 이뤄진 변수 공간에 다른 데이터를 재할당 할 수 있는가?
  • 불변값 ≠ 상수
    • 불변성 여부 : 데이터 영역 메모리를 바꿀 수 있는가?
  • 한 번 만들어진 값은 가비지 컬렉팅을 당하지 않는 한 영원히 변하지 않는다.

1-4-2 가변값

  • 참조형 데이터의 할당
    var obj1 = { a : 1, b : 'bbb' };
    obj1.a = 4;
- obj1가 바라보고 있는 주소는 바뀌지 않는다.

  • 중첩 객체
    var obj = { x : 3, arr : [ 3, 4, 5 ] };
    obj.arr = 'str';
- 참조 카운터 : 어떤 데이터에 대해 자신의 주소를 참조하는 변수의 개수
- 참조 카운터가 0인 메모리 주소는 가비지 컬렉터의 수거 대상이 되고, 수거된 메모리는 다시 새로운 값을 할당할 수 있는 빈 공간이 된다.

1-4-3 변수 복사 비교

  • 기본형 데이터는 복사 후 값을 바꾸면 값의 주소가 바뀌는데, 참조형 데이터는 복사 후 값을 바꿔도 값의 주소가 바뀌지 않는다.
  • 참조형 데이터를 복사 후 객체 자체를 변경했을 때는?
    var obj1 = { c : 10, d: 'ddd' }
    var obj2 = obj1;
    
    obj2 = { c : 20, d: 'ddd' };
- 참조형 데이터를 복사 후 값을 바꾼 것임에도 값의 주소가 바뀐다.
  • 즉, 참조형 데이터가 '가변값'이라는 것은 그 내부의 프로퍼티를 변경할 때만 성립한다.

1-5 불변 객체

1-5-1 불변 객체를 만드는 간단한 방법

var copyObject = function (target) {
	var result = {};
	for (var prop in target) {
		result[prop] = target[prop];
	}
	return result;
};

1-5-2 얕은 복사와 깊은 복사

  • 얕은 복사 shallow copy : 바로 아래 단계의 값만 복사 (바로 위의 copyObject)
  • 깊은 복사 deep copy : 내부의 모든 값들을 하나하나 찾아서 전부 복사

1-6 undefined와 null

  • undefined : 자바스크립트 엔진이 사용자가 어떤 값을 지정할 것이라고 예상되는 상황임에도 그렇지 않은 아래 3가지 경우에 반환.
    • 값을 대입하지 않은 변수, 즉 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때
      • 배열의 경우 empty
    • 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때
    • return 문이 없거나 호출되지 않는 함수의 실행 결과
  • null : 값이 '비어있음'을 명시적으로 나타내고 싶을 때 사용하는 용도.
profile
Frontend Developer

0개의 댓글