power-girl0-0

[객체지향] 참조 본문

언어/Javascript

[객체지향] 참조

power-girl0-0 2021. 2. 6. 02:01
728x90

 

 

생활코딩 javascript를 참고하여 공부하였습니다.

스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다.

( 출처 :  https://opentutorials.org/course/743 )


 복제 

전자화된 시스템의 가장 중요한 특징은 복제다.

프로그래밍에서 복제가 무엇인가에 대해 예제를 통해서 알아보자.

var a = 1;
var b = a;
b = 2;
console.log(a); // 1

위 소스 코드의 결과는 1이 출력된다.


값을 변경한 것은 변수 b이기 때문에 변수 a에 담겨있는 값이 그대로인 것은 당연하다.

즉, 변수 b의 값에 변수 a의 값이 복제된 것이다.

 

이를 그림으로 표현하면 아래와 같다.


 참조 ( reference ) 

아래 예제를 통해서 알아보자.

var a = {'id':1};
var b = a;
b.id = 2;
console.log(a.id);  // 2

위 소스 코드의 결과는 2가 출력된다.


이 코드의 핵심은 아래와 같다.

b.id = 2;
System.out.println(a.id);   

복제에서 봤던 예제와 비교하면, 두개의 차이점을 확인할 수 있다.

해당 소스의 경우 변수 b에 담긴 객체의 id 값을 2로 변경했을 뿐인데 a.id의 값도 2가 된 것이다.

 

이것은 변수 b와 변수 a에 담긴 객체가 서로 같다는 것을 의미하다.


비유하자면 복제는 파일을 복사하는 것이고, 참조는 심볼릭 링크(symbolic link) 혹은 바로가기(윈도우)를 만드는 것과 비슷하다.

원본 파일에 대해서 심볼릭 링크를 만들면 원본이 수정되면 심볼릭 링크에도 그 내용이 실시간으로 반영되는 것과 같은 효과다.

 

심볼릭 링크를 통해서 만든 파일은 원본 파일에 대한 주소 값이 담겨 있다.

따라서 심볼릭 링크에 접근하면 컴퓨터는 심볼릭 링크에 저장된 원본의 주소를 참조해서 원본에 대한 작업을 하게 된다. 다시 말해서 원본을 복제한 것이 아니라 원본 파일을 참조(reference)하고 있는 것이다.

 

덕분에 저장 장치의 용량을 절약할 수 있고, 원본 파일을 사용하고 있는 모든 복제본이 동일한 내용을 유지할 수 있게 된다.


다시 본론으로 돌아와, 아래 두 개의 구문의 차이점을 생각해보자.

a = 1;
a = {'id':1};

첫번재 구문은 데이터형이 숫자이고, 두번째는 객체이다.

 

객체를 다른 말로는 참조 데이터 형(참조 자료형)이라고도 부른다.

기본 데이터형은 위와 같이 복제 되지만 참조 데이터형은 참조된다.


모든 객체는 참조 데이터형인데, 이를 그림으로 나타내면 아래와 같다.

정리하면 변수에 담겨있는 데이터가 원시형이면 그 안에는 실제 데이터가 들어있고, 객체면 변수 안에는 데이터에 대한 참조 방법이 들어있다고 할 수 있다.


 함수 

그럼 일종의 변수할당이라고 할 수 있는 메소드의 매개변수는 어떻게 동작하는가를 알아보자.

 

다음은 원시 데이터 타입을 인자로 넘겼을 때에 대한 소스 코드이다.

var a = 1;
function func(b){
    b = 2;
}
func(a);
console.log(a);

위 소스코드의 결과는 1이 출력된다.

 

a를 인자로 넘겨주긴하지만, b는 2라는 새로운 값을 가지고 return해주는 값도 없으므로 a에 영향을 주지 않는다.


다음은 참조 데이터 타입을 인자로 넘겼을 때에 대한 소스이다.

var a = {'id':1};
function func(b){
    b = {'id':2};
}
func(a);
console.log(a.id);  // 1

위 소스 결과는 1이다.

 

함수 func의 파라미터 b로 객체 a를 전달하고 있다.

하지만 b는 새로운 객체를 대체하고 있으며, 이는 b가 가르키는 객체를 변경하는 것이기 때문에 a에 영향을 주지 않는다.


하지만 아래는 다르다.

var a = {'id':1};
function func(b){
    b.id = 2;
}
func(a);
console.log(a.id);  // 2

파라미터 b는 객체 a의 레퍼런스다.

이 값의 속성을 바꾸면, 그 속성이 소속된 객체를 대상으로 수정작업을 한 것이 되기 때문에 b의 변경은 a에도 영향을 미치게 된다.


 참조 

 

 

 

728x90

'언어 > Javascript' 카테고리의 다른 글

Object Model & 객체화  (0) 2021.02.06
HTML에서 JavaScript 로드하기  (0) 2021.02.06
[객체지향] 데이터 타입  (0) 2021.02.05
[객체지향] Object  (0) 2021.02.05
[객체지향] 표준 내장 객체의 확장  (0) 2021.02.05
Comments