티스토리 뷰
자바스크립트 데이터 타입
- 기본형 : 숫자, 불리언, null, undefiend, Symbol
- 참조형 : 객체, 함수, 날짜 , 배열
자바스크립트가 변수를 선언/할당 하는 과정 - 기본형
- 변수 : 변할 수 있는 데이터
- 식별자: 해당 변수를 가리키는 이름
var a = 1;
위와 같은 코드를 썼을 때, 자바스크립트 엔진은 다음과 같이 작동한다.
- 선언된 변수를 위한 비어있는 메모리 공간을 확보한다.
- 해당 메모리 공간의 식별자를 'a' 로 지정한다.
- a에 할당할 데이터 1이 메모리 영역에 존재하는지 살펴 본다.
- 있다면 해당 주소를 'a' 공간에 대입하고, 없다면 새로운 메모리 공간에 데이터 1을 저장한 후 해당 공간의 주소를 'a' 공간에 대입한다.
- 왜 자바스크립트는 변수 a 공간에 바로 데이터를 할당하지 않고 해당 데이터의 '주소값'을 할당하는가 ?
- 형변환이 필요 없다.
- C/C++ 자바에서는 변수를 선언할 때부터 해당 변수 타입에 따라 메모리를 다르게 할당한다 . ( 정수는 4 byte, 소수는 2byte..) 이에 따라서 해당 변수의 값을 바꾸고자 할 때 형변환 과정이 필수이다. 하지만 자바스크립트에서 변수의 값을 변경하고자 하면 해당 변수가 가리키는 주소값만 변경하면 되므로 형변환 과정이 필요 없다.
- 자바스크립트에서 아래 예제와 같이 변수 a가 가리키는 문자열 "abc"에 "def"를 추가한다고 할때, 자바스크립트는 기존 "abc"가 저장된 메모리 공간에서 값 자체를 바꾸는게 아니라, 아예 새로운 메모리 공간을 확보하여 "abcdef" 값을 할당하고, 변수 a 가 가리키는 주소값을 변경한다.
var a ="abc";
a+="def";
- 메모리의 효율적인 사용
- 만약 같은 값을 가진 변수가 몇천개, 몇만개씩 필요하다면 , 우리는 해당 변수마다 값을 일일이 할당할 필요 없이 해당 값을 저장한 메모리 영역을 하나 만들고, 모든 변수가 하나의 주소를 가리키도록 하면 된다.
변수 선언/할당 과정으로 알 수 있는 기본형의 불변성
- 위의 예제에서도 보았듯, 변수가 가리키고 있는 메모리 공간에 저장된 '값 자체'는 변할 수 없다.
- 메모리 공간에 저장된 값 1을 2로 바꿀 수 없음
- 다만, 변수가 가리키는 주소값을 변경 할 수 있을 뿐이다.
자바스크립트가 변수를 선언/ 할당하는 과정 - 참조형
var obj = {
a: 1,
b: 'abc'
};
위와 같은 코드를 썼을 때 자바스크립트 엔진은 다음과 같이 작동한다.
- 선언된 변수 obj 를 위한 비어있는 메모리 공간을 하나 확보한다.
- 해당 변수의 식별자를 'obj'로 지정한다.
- 해당 변수에 할당된 값을 메모리 영역에서 찾으려고 보니 여러개의 프로퍼티로 이루어진 데이터 그룹이다. 일단, 해당 데이터 그룹 ( 프로퍼티들 ) 의 주소를 저장할 메모리 공간을 확보해준다. ( 4 에서 확보된 메모리 공간의 주소값을 저장하게 된다.)
- 그룹 내부의 프로퍼티 들을 위한 메모리 공간을(여기서는 두개의 공간) 확보해주고 식별자를 프로퍼티 이름으로 (a, b)지정해준다.
- 각각의 프로퍼티를 위한 메모리 공간은 또 프로퍼티에 저장된 값을 가리키는 메모리 공간의 주소값을 저장해야한다.
- 즉 참조형은 변수 obj 는 데이터 그룹(여러개의 프로퍼티)이 할당된 주소를 값으로 가지는 메모리 영역의 주소를 값으로 가진다. 그리고 그 데이터 그룹이 저장된 메모리 영역 역시, 해당 프로퍼티들의 값이 저장된 메모리 영역의 주소를 값으로 가진다. (..복잡..)
참조형은 가변한가 ?
var obj = {
a:1,
b: 'abc'
}
obj.a = 2;
- 참조형이 '가변하다'라는 것은 내부의 프로퍼티 값을 바꿀 수 있기 때문이다. 하지만 프로퍼티 값을 바꾸는 것 역시 결국 프로퍼티가 가리키는 주소를 바꾼다는 것이므로, 주관적인 해석으로는 완벽히 가변하다고 할 수 없을것이라 생각한다. 물론 객체 전체로 봤을 때, 프로퍼티 값만 변경 할 수 있으므로 객체의 입장에서는 가변하다.
- 여기서 obj의 프로퍼티 a의 값을 바꾼 다는 것은 a가 가리키고 있는 값의 주소를 변경한다는 것이다.
var obj = {
a:1,
b: 'abc'
}
obj = { a: 5, b :'def'}
- 위와 같이 변수 obj 자체를 바꿔버리면 어떻게 될까. 이는 결국 기본형에서 변수 값을 변경하는 것과 같은 동작을 띈다. 기존의 obj가 가리키고 있던 obj 변수 -> 데이터 그룹 - > 프로퍼티 - > 값 ...을 변경하는게 아니라, 아예 새로운 메모리 영역을 생성하여 obj에 할당하게 된다.
- 잘못된 부분이나 궁금한점 있으시면 언제든 댓글 환영입니다
'programming language > JavaScript' 카테고리의 다른 글
[JavaScript] 자바스크립트 실행컨텍스트 (0) | 2020.07.26 |
---|---|
[JavaScript] 깊은복사와 얕은복사 (0) | 2020.07.25 |
댓글