코어 자바스크립트 #01 (데이터 타입)

인사이드 자바스크립트 후반부(프로토타입 체이닝 실행컨텍스트 스코프체인 클로저 등)는

거의 이해가 안되길래 책을 바꿔서 공부하고 다시 돌아가서 보려고 한다ㅎㅎ

목차를 보니 마침 내가 이해 못했던 부분 위주로 구성돼있음! 

어차피 이쪽 책은 꾸준히 봐야 되니까...!

이것도 이해 못하면...? ㄱㅊㄱㅊ~! 다음 책 또 찜해놓음^^

.

.

그런데... 그것이 일어나고야 말았다

저번책보다 더.. 어려운 책인 것 같다.. ㅎㅎ;

예제로 나오는 코드 이해를 못하겠어 ㅠ^ㅠ

---

 

데이터 타입의 종류

기본형(원시형Primative type) : 숫자number, 문자열string, 불리언boolean, null, undefined, 심볼Symbol(ES6 추가) 

• 할당이나 연산시 복제
• 값이 담긴 주솟값을 바로 복제
• 불변성immutability

참조형(reference type) : 객체object, 배열array, 함수function, 날짜Date, 정규표현식RegExp, Map, WeakMap, Set, WeakSet(ES6 추가)

• 할당이나 연산시 참조
• 값이 담긴 주솟값들로 이루어진 묶음을 가리치는 주솟값을 복제

---

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

메모리와 데이터 : 모든 데이터는 바이트 단위의 식별자, 더 정확히는 메모리 주솟값memory address을 통해 서로 구분하고 연결할 수 있음

변수 : 변할 수 있는 무언가(=데이터), 변경 가능한 데이터가 담길 수 있는 공간 또는 그릇

(수학용어를 차용했기 때문에 '수'가 붙었을 뿐, 값이 반드시 '숫자'일 필요는 없음)

식별자 : 어떤 데이터를 식별하는데 사용하는 이름, 즉 변수명

 

var a; // 변수 a 선언
a = 'abc'; // 변수 a에 데이터 할당

var a = 'abc'; // 변수 선언과 할당을 한 문장으로 표현

변수 선언 : 변수를 선언하면 컴퓨터는 메모리에서 비어있는 공간 하나를 확보함. 이 공간의 이름(식별자)을 a라고 지정

데이터 할당 : a라는 이름을 가진 위치에 문자열 'abc'를 직접 저장하는 것이 아닌 데이터를 저장하기 위한 별도의 메모리 공간을 다시 확보해서 문자열 'abc'를 저장하고, 그 주소를 변수영역에 저장. 기존 문자열에 어떤 변화를 가하든 상관없이 무조건 새로 만들어 별도의 공간에 저장.

 

※ 왜 변수 영역에 값을 직접 대입하지 않고 한 단계를 더 거칠까?

데이터 변환을 자유롭게 할 수 있게 함과 동시에 메모리를 더욱 효율적으로 관리하기 위해. 숫자형 데이터는 64비트(8바이트)의 공간을 확보하지만 문자열은 특별히 정해진 규격이 없기 때문에 용량이 가변적이다. 만약 미리 확보한 공간 내에서만 데이터 변환을 할 수 있다면 변환한 데이터를 다시 저장하기 위해서는 '확보된 공간을 변환된 데이터 크기에 맞게 늘리는 작업'이 선행되어야 한다. 결국 효율적으로 문자열 데이터의 변환을 처리하려면 변수와 데이터를 별도의 공간에 나누어 저장하는 것이 최적! 또한, 500개의 변수에 전부 숫자 5를 할당하는 상황이라면 별도의 공간에 한 번만 저장하고 해당 주소를 입력하면 주소 공간의 크기를 줄일 수 있기 때문에 변수 영역과 데이터 영역을 분리하면 중복된 데이터에 대한 처리 효율이 높아진다. 

---

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

변수variable와 상수constant를 구분하는 성질은 '변경 가능성'.  변수와 상수를 구분 짓는 변경 가능성에 대한 대상은 한 번 데이터 할당이 이뤄진 변수 영역에 다른 데이터를 재할당할 수 있는지 여부가 관건인 반면 불변성 여부를 구분할 때의 변경 가능성 대상은 데이터 영역의 메모리.

기본형 데이터

불변값 : 숫자, 문자열, boolean, null, undefined, symbol 

 

참조형 데이터

기본형 데이터와의 차이는 '객체의 변수(프로퍼티) 영역'이 별도로 존재한다는 점.

※ 객체가 별도로 사용하는 영역은 변수 영역일 뿐 '데이터 영역' 기존의 메모리 공간을 그대로 활용. 데이터 영역에 저장된 값은 모두 불변값. 그러나 변수에는 다른 값을 얼마든지 대입할 수 있음. (이 부분 때문에 참조형 데이터는 불변immutable)하지 않다(=가변값이다) 라고 하는 것.

 

중첩 객체nested object : 참조형 데이터의 프로퍼티에 다시 참조형 데이터를 할당하는 경우

가비지 컬렉터garbage collector : 참조 카운트가 0인 메모리 주소를 수거. 런타임 환경에 따라 특정 시점이나 메모리 사용량이 포화 상태에 임박할 때마다 자동으로 수거 대상들을 수거함

참조 카운트 : 어떤 데이터에 대해 자신의 주소를 참조하는 변수의 개수

---

불변객체

값으로 전달받은 객체에 변경을 가하더라도 원본 객체는 변하지 않아야 하는 경우에 불변객체immutable object가 필요함

 

얕은 복사와 깊은 복사

얕은 복사shallow copy : 바로 아래 단계의 값만 복사

깊은 복사deep copy : 내부의 모든 값들을 하나하나 찾아서 전부 복사

 

어떤 객체를 복사할 때 객체 내부의 모든 값을 복사해서 완전히 새로운 데이터를 만들고자 할 때, 객체의 프로퍼티 중에서 그 값이 기본형 데이터일 경우에는 그대로 복사하면 되지만 참조형 데이터는 다시 그 내부의 프로퍼티들을 복사해야 함.

---

undefined 와 null

undefined :  사용자가 명시적으로 지정할 수도 있지만 값이 존재하지 않을 때 자바스크립트 엔진이 자동으로 부여하는 경우도 있음. ('비어있음'을 의미하긴 하지만) 그 자체로 값.

 

사용자가 응당 어떤 값을 지정할 것이라고 예상되는 상황임에도 실제로는 그렇게 하지 않았을 때 undefinde를 반환함. 

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

null : '비어있음'을 명시적으로 나타내고 싶을 때.

※ 주의할 점 : null의 type은 object

어떤 값이 null 인지 판단하려면 (===) 연산자를 사용!

((==) 연산자는 undefined와 null의 동일하다고 나옴)

---

정리

변수를 선언하면 컴퓨터는 우선 메모리의 빈 공간에 식별자를 저장하고, 그 공간에 자동으로 undefined 를 할당한다. 이후 그 변수에 기본형 데이터를 할당하려고 하면 별도의 공간에 데이터를 저장하고, 그 공간의 주소를 변수의 값 영역에 할당한다.

참조형 데이터를 할당하고자 할 경우 컴퓨터는 참조형 데이터 내부 프로퍼티들을 위한 변수 영역을 별도로 확보해서 확보된 주소를 변수에 연결하고, 다시 앞서 확보한 변수 영역에 각 프로퍼티의 식별자를 저장하고, 각 데이터를 별도의 공간에 저장해서 그 주소를 식별자들과 매칭 시킨다. 이처럼 할당 과정에서 기본형과 차이가 생긴 이유는 참조형 데이터가 여러 개의 프로퍼티(변수)를 모은 '그룹'이기 때문이다. 

'없음'을 나타내는 값은 두 가지가 있는데, undefiend는 어떤 변수에 값이 존재하지 않을 경우를 의미하고 null은 사용자가 명시적으로 '없음'을 표현하기 위해 대입한 값이다. 본래의 의미에 따라 사용자가 없음을 표현하기 위해 명시적으로 undefined를 대입하는 것은 지양하는 것이 좋다. 

- 출처: 코어 자바스크립트