원시 자료형과 참조 자료형

Minsu Lee·2023년 4월 27일
0
post-thumbnail

✨SEB FE

[JavaScript] 핵심 개념과 주요 문법

💡 Go for it now. The future is promised to no one.
"지금 시작해라. 미래는 아무에게도 약속되지 않는다."


JavaScript에서 자료형(type)이란 값(value)의 종류다. 각각의 자료형은 고유한 속성과 메서드를 가지고 있다. 자료형은 크게 두 가지로 구분할 수 있는데, 바로 원시 자료형(primitive type)과 참조 자료형(reference type)이다.

📌 원시 자료형 (primitive type)

📝 원시 자료형

원시 자료형의 값, 즉 원시 값은 변경이 불가능한 값(immutable value)이다. 한 번 생성된 원시 값은 읽기 전용 값이므로 변경할 수 없다.

"원시 값은 변경 불가능하다" 는 말은 원시 값 자체를 변경할 수 없다는 것이지 변수 값을 변경할 수 없다는 것이 아니다. 변수는 언제든지 재할당을 통해 변수 값을 변경할 수 있다.

변수 값의 변경
변수 값을 변경하기 위해 원시 값을 재할당하면 새로운 메모리 공간을 확보하고 재할당한 값을 저장한 후, 변수가 참조하던 메모리 공간의 주소를 변경한다.(불변성) 불변성을 갖는 원시 값을 할당한 변수는 재할당 이외에 변수 값을 변경할 수 있는 방법이 없다.

📝 값에 의한 전달

변수에 원시 값을 갖는 변수를 할당하면 할당받는 변수에는 할당되는 변수의 원시 값이 복사되어 전달된다. -> 값에 의한 전달.

아래 예시 코드는 모던 자바스크립트 deep dive를 참조했다.

var score = 80;

//copy변수에는 score변수의 값 80이 복사되어 할당된다.
var copy = score;

console.log(scpre, copy) // 80 80
console.log(score === copy) // true

//score변수와  copy변수의 값은 다른 메모리 공간에 저장된 별개의 값
//따라서 score 변수의 값을 변경해도 copy변수의 값에는 어떠한 영향도 주지 않는다
score = 100;
console.log(scpre, copy) // 100 80
console.log(score === copy) // false

📌 참조 자료형 (reference type)

📝 참조 자료형

참조 자료형의 값, 즉 참조 값은 변경 가능한 값(mutable value)이다. 원시 값은 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있지만, 참조 값은 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 참조 값(생성된 객체가 저장된 메모리 공간의 주소)에 접근할 수 있다.

"참조 값은 변경이 가능하다" 객체를 할당한 변수는 재할당 없이 객체를 직접 변경할 수 있다. 즉, 재할당 없이 프로퍼티를 동적으로 추가할 수도 있고 프로퍼티 값을 갱신할 수도 있으며 프로퍼티 자체를 삭제할 수도 있다.

📝 참조에 의한 전달

참조 자료형을 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달 된다. -> 잠조에 의한 전달.
아래 예시 코드는 모던 자바스크립트 deep dive를 참조했다.

var person = {
	name: "Lee"
};

//참조 값을 복사. copy와 person은 동일한 참조 값을 갖는다.
var copy = person;

//copy와 person은 동일한 객체를 참조한다.
console.log(copy===person); //true

//copy를 통해 객체를 변경한다.
copy.name = "Kim";

//person을 통해 객체를 변경한다.
person.address = "Seoul";

//copy와 person은 동일한 객체를 가리킨다.
//어느 한쪽에서 객체를 변경하면 서로 영향을 주고받는다.
console.log(person); //{name: "Kim", address: "Seoul"}
console.log(coyp); //{name: "Kim", address: "Seoul"}

📌 정리!

원시참조
원시 자료형을 변수에 할당하면 메모리 공간에 값 자체가 저장된다.참조 자료형을 변수에 할당하면 메모리 공간에 주소 값이 저장된다.
원시값을 갖는 변수를 다른 변수에 할당하면 원시 값 자체가 복사되어 전달된다.참조값을 갖는 변수를 다른 변수에 할당하면 주소 값이 복사되어 전달된다.
원시 자료형은 변경 불가능한 값(immutable value)이다. 즉 한 번 생성된 원시 자료형은 읽기 전용이다.참조 자료형은 변경이 가능한 값이다.(mutable value)

✨마무리

모던 자바스크립트 deep dive이 책이 JavaScript를 이해하는데 너무너무너무 많은 정보를 주고있다! 정말 모두에게 추천하고 싶어!

profile
빙글빙글

0개의 댓글