[JS] 원시 자료형과 참조 자료형

somin·2021년 7월 1일

JavaScript

목록 보기
8/16

개념

1. 역사

  • 과거엔 데이터 저장소(메모리)의 용량이 제한되어 변수 하나에 하나의 원시 자료형 밖에 담을 수 밖에 없었음
  • 띄어쓰기, 탭, 쉼표 등으로 데이터를 구분하여 배열과 비슷한 형태로 자료 구조를 구현(comma-separated values)했으나 보통 사이즈가 제한되어 번거로움
  • 데이터의 크기가 동적으로 변하는 특별한 데이터 보관함의 필요성 대두

2. 원시타입(primitive type)

  • 원시타입 : 고정된 저장 공간을 차지하는 데이터로 하나의 정보를 가지고있음
  • 객체가 아니면서 method를 가지지 않는 6가지의 타입인 number, string, boolean, null, undefined가 해당
  • 변수에는 데이터의 크기와는 관계 없이 하나의 데이터만 담을 수 있으며 값 자체에 대한 변경이 불가능(immutable)하지만 변수에 다른 데이터를 할당할 수 있음
let KKAKKA = "Cat!"  //"Cat!"은 변경할 수 없는 고정된 값
KKAKKA = "Black cat!" //KKAKKA라는 변수에 재할당하여 변수에 담긴 내용 변경 가능

const KKAKKA = 7;
KKAKKA = 42; //에러 발생 : const로 선언하면 재할당 불가
let KKAKKA = 7; //7은 변경할 수 없는 고정된 값
function changeAge(age) { //age에 KKAKKA의 값인 7이 전달
  age = 26; //age(7)에 26이 할당
}
changeAge(KKAKKA) //KKAKKA의 값(7)을 인자로 전달하여 실행
console.log(KKAKKA) //7 : 초기에 할당된 값 그대로 유지

3. 참조타입(reference type)

  • 참조타입(주소 타입) : heap이라는 특별한 저장 공간을 사용하고 이 저장 공간이 유동적으로 늘어나며, 여러 개의 데이터를 가지고 있음
  • 원시 자료형이 아닌 모든 것은 참조 자료형으로 배열, 객체, 함수가 대표적
  • 데이터가 위치한 곳(메모리 상 주소)을 가리키는 주소가 변수에 저장되는 방식으로 변수의 주소를 참조하게 됨
let myArray = [1, 2, 3, 6];
let yourArray = myArray; //myArray의 주소가 복사
yourArray[3] = 4; //같은 주소를 공유하기에 myArray[3]도 4로 바뀜
yourArray = undefined; 
//yourArray에 원시 자료형 undefined가 할당되었기 때문에, myArray에 접근할 수 없어짐
console.log(myArray) //myArray는 바뀐 그대로 [1, 2, 3, 4]
console.log([1,2,3] === [1,2,3]); //false
console.log({ name: 'KKAKKA' } === { name: 'KKAKKA' }); //false
//===은 주소값이 같은지를 확인하는데 값이 같아도 저장된 주소가 다르기 때문

원시타입과 참조타입의 차이

  • 원시 자료형이 할당될 때에는 변수에 값(value) 자체가 담김
  • 변수가 원시타입 데이터를 복사하면 데이터값이 복사되므로 기존 데이터에 영향이 가지 않음
let KKAKKA = 7;
let somin = KKAKKA; //변수 KKAKKA의 데이터값이 복사
somin = 26; //변수 KKAKKA와 somin은 별개의 변수이므로 KKAKKA엔 영향이 가지않음
console.log(KKAKKA) //7
  • 참조 자료형이 할당될 때는 보관함의 주소(reference)가 담기기 때문에 기존에 고정된 크기의 보관함이 아니라 동적으로 크기가 변하는 특별한 보관함을 사용할 수 있음
  • 변수가 참조타입 데이터를 복사하면 주소가 복사되므로 복사한 데이터에서 원소 변경시 주소 안에 있는 데이터가 변경되어 기존 데이터에 영향이 감
let KKAKKA = { age: 7 };
let somin = KKAKKA; //변수 KKAKKA의 데이터가 위치한 주소가 복사
somin.age = 26; //변수 KKAKKA와 somin은 같은 주소를 참조하기에 KKAKKA.age 값도 변경
console.log(KKAKKA.age) //26
profile
✏️

0개의 댓글