원시자료형 vs 참조자료형

Minwoo Gwak·2023년 3월 2일
0

코드스테이츠

목록 보기
2/3
post-thumbnail

원시자료형

자바스크립트에서 원시자료형은 string, number, boolean, undefined, symbol, null, Bigint 총 7개가 있다. bigint에 대해서 잘 모르는 ㅂ분들도 있을수 있으니 Number와의 비교를 해놓은 좋은 레퍼런스를 하나 링크로 걸어놓겠다.
Bigint vs Number in JS

원시자료형들의 큰 특징중 하나는 자료형의 값이 수정되지 못한다는 것이다. 여기서 질문할 수 있는것이, 분명 원시자료형을 선언하고 이후에 다른 값으로 변경했어요! 라고 물어볼수 있다. 맞다. 그렇게 자료형 선언 이후에 변경을 한것은 그 자료형에 다시 reassign 한것이다. 값 자체에서 우리가 array나 object에서 하던 값 내부 수정은 불가능 하다는 이야기 이다. 예를 들어 아래코드를 보자.

let str = 'hello world';
let arr = ['hello', 'world'];


//분명 array는 인덱스의 값들을 하나하나 수정할수 있다.
arr[1] = 'world!!' // arr => ['hello', 'world!!']


//하지만 str과 같은 원시자료형에서는 이런게 불가능하다는 소리이다.
str[str.length] = '!!' // 이런다고 str값이 바뀌지 않는다.

참조자료형

원시자료형과는 다르게 참조자료형은 정해진 크기가 없어서 데이터를 자유롭게 수정하고 다룰수 있다.
object, function, array와 같은 것들이 참조자료형이다.
원시자료형과의 가장 큰 차이점은 참조자료형이 데이터를 저장하는 방식에 있다. 원시자료형은 데이터를 declaration하고 assign했을때 stack에 변수명과 데이터값이 저장되게 되지만, 참조자료형은 변수명과 메모리주소값이 저장되게 된다. 그리고 실제 데이터들은 Heap이라는 곳에 저장되게 된다.
만약 기존에 있던 참조자료형을 다른 변수명을 가진 변수에 저장한다고 해보자.

let a = [1,2,3];
let b = a;

이렇게 되면 ba가 가지고 있는 주소값, 즉 a의 데이터가 있는 heap의 주소를 복사하게 된다. 따라서 ab는 서로 같은 데이터를 바라보고있고, 둘중 한곳에서 데이터를 수정하면 나머지 하나의 데이터도 수정된다.

profile
CS and Math student at the University of Illinois with a passion for web development and aspiring to become a frontend developer.

0개의 댓글