[JavaScript] 참조와 복사

복사

 

자바스크립트에서는 원시 데이터형을 제외한 모든 데이터 타입은 객체이다. 객체를 다른 말로는 참조 데이터 형(참조 자료형)이라고도 부른다.

 

자바스크립트는 원시값(숫자, 문자, boolean)에선 값이 복사가 되고, 객체일 때는 다르게 동작한다. 

위 사진처럼 값을 복사하고 싶으면 변수를 지정하여 바꿔준다.

위 사진에는 값을 false로, 복사 = 값을 통해 value를 복사해준 후, 복사의 false값을 true로 바꿨다.

그 결과 복사는 true라는 value를 갖고, 값은 false라는 value를 갖는 형태를 볼 수 있다. 

이 것을 통해 알 수 있는 것은 원시값을 복사하면 변수에 따로따로 동작하는 것을 알 수 있다. 

참조

하지만, 객체일 때는 다르게 동작한다.

여기서 객체란 객체, 배열, 함수를 통틀어서 지칭한다.

 

아래 사진을 먼저 보자

key: value 형태인 객체에 이름이라는 키에 skykchmin을 준 후에 사람이라는 객체를 복제인간이 복사하였다.

복제인간은 이름을 '민경'으로 바꾸게 되고 사람과 복제인간의 이름을 확인해본 결과 'skykchmin'에서 둘다 '민경'으로 변경되었다. 이렇게 동작하는 이유는 객체는 참조 형태를 갖기 때문이다. 

 

쉽게 생각하면, 비유하자면 복제는 파일을 복사하는 것이고 참조는 심볼릭 링크(symbolic link) 혹은 바로가기(윈도우)를 만드는 것과 비슷하다. 심볼릭 링크를 통해서 만든 파일은 원본 파일에 대한 주소 값이 담겨 있다. 누군가 심볼릭 링크에 접근하면 컴퓨터는 심볼릭 링크에 저장된 원본의 주소를 참조해서 원본의 위치를 알아내고 원본에 대한 작업을 하게 된다. 원본을 복제한 것이 아니라 원본 파일을 참조(reference)하고 있는 것이다.

 

배열도 마찬가지로, 배열의 0번째 요소를 변경하였지만, 배열도 참조관계이기 때문에, 복사와 배열이 같은 결과를 지니게 되고

함수도 마찬가지로 참조관계이기 때문에, 복사와 함수가 같은 결과를 지니게 된다.

 

자바스크립트에서 데이터가 원시형이면 그 안에는 실제 데이터가 들어있고, 객체면 변수 안에는 데이터에 대한 참조 방법이 들어있다고 할 수 있다.

 

참고

• 인프런 - 제로초 강의
• 생활코딩