우당탕탕 개발일기

모던 자바스크립트 11. 원시 값과 객체의 비교 본문

What I Learned/JavsScript

모던 자바스크립트 11. 원시 값과 객체의 비교

rilee 2024. 4. 19. 12:01
728x90

1. 원시 타입

- 변경 불가능한 값(읽기 전용[readOnly])

let str = 'string';

str[0] = 'S'; // 문자열은 원시값이라서 변경할 수 없다. 에러도 발생하지 않는다.

console.log(str); // string

 

- 원시 타입 값을 변수에 할당하면 실제 값이 저장된다.

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

- '재할당'을 제외하곤 변수 값을 변경할 수 있는 방법 X 

  = 예기치 못한 변경이 일어나지 않는다 = 데이터 신뢰성을 보장한다

cf. 재할당은 기존 문자열을 변경하는 것이 아니라 새로운 문자열을 새롭게 할당하는 것이기 때문.

let str = 'hello'; // 식별자(변수) str은 문자열 'hello'가 저장된 메모리 공간을 가리킴
str = 'world'; // 'hello'를 수정하는 것이 아닌, 새로운 문자열 'world'를 메모리에 생성 후 
               // 식별자 str은 이 world를 가리키게 된다.
               // 즉, 식별자 str은 'hello'를 가리키고 있다가 'world'를 가리키게 된 것

 

값에 의한 전달

변수에 원시 값을 갖는 변수를 할당하면 할당받는 변수(copy)에는 할당되는 변수의 원시 값이 복사되어 전달되는 것.

다만, 두 변수의 원시 값은 서로 다른 메모리 공간에 저장된 별개의 값이므로 어느 한쪽에서 재할당을 통해 값을 변경해도 다른 한 쪽은 영향을 받지 않는다.

const score = 100;

let copy = score;

console.log(score, copy); // 100 100
console.log(score === copy); // true

// 복사되어 할당되기때문에 같은 값을 가지지만, score의 100과 copy의 100은 다른 메모리 공간에 저장된 별개의 값
// 따라서 score의 값을 변경해도, copy의 값에는 영향 X

score = 80;

console.log(score, copy); // 80, 100
console.log(score === copy); // false

 

2. 객체 타입

- 변경 가능한 값

  객체를 할당한 변수는 재할당 없이 객체를 직접 변경할 수 있다.

  = 프로퍼티의 동적 추가 / 값 갱신 / 삭제가 가능 하다.

- 객체는 참조에 의해 할당되고 복사된다.

- 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달(참조에 의한 전달)

 

참조에 의한 전달

cf. 사실상 JS에는 참조에 의한 전달은 존재 X.해당 교재에서 전달되는 값의 종류에 따라 값에 의한 전달과 참조에 의한 전달로 구분
cf2.포인터가 존재하는 언어의 '참조에 의한 전달'과는 다르다.

let person = {
	name: '반원재'
}

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

console.log(copy === person); // true

copy.name = '이규리';
person.address = '서울특별시';

console.log(person); // {name: '이규리', address: '서울특별시'}, copy.name으로 변경한대로 person도 변경됨
console.log(copy);   // {name: '이규리', address: '서울특별시'}, person.address대로 copy도 변경됨

 

 

Ref.

https://ko.javascript.info/object-copy

 

참조에 의한 객체 복사

 

ko.javascript.info

 

728x90