3-1 데이터 타입 종류 및 메모

1. 데이터 타입 심화

데이터 타입은 크게 2가지로 나뉘는데

 

기본형과 참조형으로 나눠진다.

 

기본형 : Number(숫자), String(문자열), Boolean(참, 거짓),

null(개발자 지정 빈 값), undefined(빈 값), Symbol(ES6 추가된 자료형)

 

참조형 : refer 무언가를 참조하고 있는 변수로 Object(객체)이다.

Array(배열), Function(기능), Date(연월일시분초),

RegExp 정규 표현식), Map(모든 타입을 key로 가능), Set(중복 불허 배열)

기본형과 참조형을 나누는 기준

 

1. 값의 저장 방식 및 복제 방식 : 메모리에 어떻게 저장되고, 복제되는가?

2. 불변성 여부 : 값이 불변하는가, 아닌가?

 

1. 값의 저장 방식 및 복제 방식

 

1. 기본형 : 값이 담긴 주소값을 바로 복제

2. 참조형 : 값이 담긴 주소값들을 묶음으로 가리키는 주소값을 복제

 

2. 불변성 여부

 

1. 기본형 : 메모리 관점에서 불변성을 띔(= 불변한다)

2. 참조형 : 메모리 관점에서 불변성을 띄지 않음

 

 

메모리 데이터

 

1. 비트(bit)

- 컴퓨터가 이해할 수 있는 가장 작은 단위

- 0과 1을 가지고 있는 메모리를 구성하기 위한 작은 조각

- 작은 조각들이 모여서 '메모리'가 됩니다

 

2. 바이트(byte)

- 0과 1만 표현하는 비트를 모두 찾기는 부담

- 비트 8개를 묶어 만든 단위(8bit = 1byte)

3. 메모리 : byte 단위로 구성

- 모든 데이트는 byte 단위의 식별자인 메모리 주소값을 통해서 서로 구분 된다.

 

4. JavaScript의 메모리 관리 방식

(C 계열, Java와 다른 방식)

자료형	C 계열, Java	메모리 크기(byte)
정수	byte	1
정수	short	2
정수	int	8
정수	long	16
실수	float	4
실수	double	8
bool	bool(boolean)	1
문자	char	1
문자열	string	문자열의 길이 인코딩 방식에 따라 다르다.

 

JavaScritp	자료형	메모리 크기(byte)
	var	가변적이다.
	let
	const

 

C 계열, Java가 만들어진 시기에는

메모리 크기에 따른 누수를 걱정했기

때문에 개발자가 크기를 지정해줘야 했지만,

 

JavaScript가 만들어진 시기에는

HW적으로 메모리 크기가 많이 커져

개발자가 크기에 따른 지정을 안 해줘도 된다.

 

 

변수 선언(with 기본형 데이터)

 

var testValue = 3

var : 자료형

testValue : 변수명, 식별자

3 = 데이터, 변수

 

 

위와 같이 메모리를 사용하는 이유는

 

1. 메모리 효율성

2. 메모리 관리

 

를 위해서다! 

 

기본형 데이터와 참조형 데이터

 

1. 변수 VS 상수

 

- 변수 : 변수 영역 메모리를 변경할 수 있다.

- 상수 : 변수 영역 메모리를 변경할 수 없다.

 

변수가 다른 값으로 변경 돼 이전 값의 데이터 주소가

사용되지 않으면 이전 데이터 주소는 어떻게 될까?

 

가비지 컬렉션 : 메모리 관리 방법 중 하나로, 프로그래머가 동적으로 할당한 메모리 영역 중 더 이상 쓰이지 않는 영역을 자동으로 찾아내어 해제하는 기능

 

2. 불변하다 vs 불변하지 않다.

 

-불변하다 : 데이터 영역 메모리를 변경할 수 없다.

- 불변하지 않다 : 데이터 영역 메모리를 변경할 수 있다.

 

변수 선언(with 참조형 데이터) : Object를 위해서 별도의 공간이 필요하다 

var obj1 = {

    a : 1,

    b : 'bbb'

}

obj.a = 2

 

변수 복사의 비교

 

 

 

복사 이후 값 변경(객체 자체를 변경)

 

 

 

코드로 알아보기 

 

객체 자체를 가져와 

다른 객체에 복사를 하고

객체의 요소 값을 변경할 경우 

 

기존 객체도 복사된 객체에 의해 변경된다.

(이유 : 객체들의 주소가 같기 때문에)

 

-> 객체를 복사할 때는 새로운

객체로 만들어 복사해야한다.

(완전한 해결책 아님)

 

방법 : 

 

 

하지만, 위의 방식도

객체의 속성이 더 많아지면

 

return 

{

    key : value,

    key : value,

    key : value,

    key : value,

    key : value,

    key : value,

    key : value,

    key : value,

    ...

}

 

속성을 다 바꿔줘야 하기 때문에 실질적인 해결책이 아니다!

 

따라서, 

 

얕은 복사

위와 같은 방식으로 

얕은 복사를 수행한다.

 

실제 사용해보면,

copyObject 함수의

 

for in 문을 통해 user 객체의 속성들을

person 객체에게 다른 주소로 

속성들을 전부 제공해서

 

person 객체의 속성을 변경하더라도

user객체의 속성이 변경되지 않도록

만들 수 있다. 

 

하지만, 얕은 복사는

객체 안에 객체가 있으면

복사해 올 수 없다...

 

ex)

let user = 

{

    name : "~~",

    age : "~~~",

     skill : 

      {

          eat : "한 입에 먹기",

          sleep : "잠자기"

      }

}

 

 

해결 방법으로 깊은 복사를 사용하게 된다.

 

깊은 복사(재귀 함수)

위의 코드와 같이 재귀 함수(함수가 자기 자신 함수를 호출하는 함수)

를 만들어 가장 깊은 속성에서 부터

얕은 속성까지 거슬러 올라오며

객체를 복사한다.

깊은 복사(while 문)

target이 객체인지 배열인지에 따라

새로운 객체 또는 배열을 만든다.

 

while 문을 사용해서 

현재 temp(배열)에서 정보를 꺼낸다

 

꺼낸 정보가 객체, 배열이면

내부 정보를 temp(배열)에 넣는다. 

 

꺼낸 정보가 자료형이면

값을 복사한다.

 

위와 같은 과정을 반복해 

깊은 복사가 가능하다.

사용해보면,

 

undefined와 null

 

undefined : JavaScript 엔진에서 값이 있어야 할 것 같은데 없는 경우

 

1. 변수에 값이 지정되지 않은 경우, 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근한 경우

2. .(점)이나 []로 접근하려 할 때, 해당 데이터가 존재하지 않는 경우

3. return 문이 없거나 호출되지 않는 함수의 실행 결과

 

ex)

 

null : 개발자가 명시적으로 값이 없다고 표현할 때 사용

주의할 점 )  null은 JavaScript 자체 버그로 Object이다...

null과 undefined는

동등 연산자에서는 true가 나오지만,

일치 연산자에서는 false가 나온다.