원시,참조 자료형과 복사

조양권·2021년 5월 18일
0

JS

목록 보기
4/17

js는 기본타입(primitive)와 참조타입(reference)로 나눌 수 있다.

기본타입은 Number, String, Boolean, undefined,null 등이 있다. 이러한 값들은 본질적으로 단순하며 여러 값으로 구성된 복합 값으로 표현할 수 없다. 기본타입은 js에서 사용할 수 있는 데이터 및 정보의 가장 단순한 형태이다. 모든 기본타입은 값을 표현하는 리터럴 방식이 있다. 리터럴은 코드에 직접 입력된 이름이나 가격처럼 변수에 저장되지 않은 값, 즉 값 자체를 의미한다.

참조타입은 참조타입의 인스턴스이며, 객체(object)와 같은 말이다. 참조타입은 object, array, function등이 있다. 기본타입은 값 그 자체를 저장하는 반면, 참조타입은 객체가 있는 메모리상 위치를 가리키는 포인터를 저장한다.

let muhan = 'infinity';
let dojeon = 'challenge';
let right_signal = ['muhan', 'dojeon', '!']
let wrong_signal = ['mu', 'ya', 'ho']

위처럼 변수를 선언했을때 다음 그림과 같이 진행이 된다.

기본 타입인 변수 muhan과 dojeon은 값 그 자체가 저장이 되있지만, 참조타입중 하나인 배열이 할당된 wrong_signal과 right_signal은 그 주소가 저장되어 있다. 만약 여기서 값의 변화와 복사가 이루어 진다면 어떻게 될까

// 1
console.log(muhan); // 'infinity'
console.log(dojeon); // 'challenge'
// 2
muhan = dojeon;
console.log(muhan); // 'challenge'
console.log(dojeon); // 'challenge'
// 3
muhan = '무한';
console.log(muhan); // '무한'
console.log(dojeon); // 'challenge'

muhan이라는 변수에 복사나 어떤 변화를 주어도 dojeon이라는 변수의 값은 변하지 않는다. 기본 타입은 값 그 자체를 복사하는 것이기에 그러하다. 위의 과정을 도식으로 보면 다음과 같다.

이번엔 참조 타입을 복사, 변형을 해보자.

// 1
console.log(right_signal); // ['muhan','dojeon','!']
console.log(wrong_signal); // ['mu','ya','ho']
//2
right_signal = wrong_signal
console.log(right_signal); // ['mu','ya','ho']
console.log(wrong_signal); // ['mu','ya','ho']
//3
right_signal.push('~~')
console.log(right_signal); // ['mu','ya','ho','~~']
console.log(wrong_signal); // ['mu','ya','ho','~~']

수정하지 않았던 wrong_signal까지 변형됨을 확인할 수있다. 참조 타입은 그 값을 객체가 있는 메모리상의 위치, 즉 해당 주소를 가리키기 때문이다. 위의 과정은 다음 도식으로 살펴보면 쉽게 이해할 수 있다.

right_signal은 wrong_signal의 배열(값)을 복사한게 아니라 해당 배열이 저장된 주소를 복사했다(stage2). 고로 wrong_signal과 right_signal은 2단계에선 같은 주소를 가리키고 있는 변수가 되었고, 3단계 수정과정에선 right_signal에 추가한 ‘~~’이 그대로 wrong_signal에도 영향을 받을 수 밖에 없는 것이다.

profile
할 수 있는 것이 늘어나는 즐거움

0개의 댓글