참조

1 minute read

시스템의 가장 중요한 특징으로 볼 수 있는 복제는 현실과 달리 비용이 거의 들지 않는다.

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

a에는 1, b에는 a가 저장되었다. 즉 1이 저장된 a를 b에 저장한 것이다. 다음 줄에서 b에는 2를 저장하고 a를 출력해보면 1의 결과가 나오는데 당연하면서도 의문이 생길 수 가 있다.

b에는 a가 저장되어있는데 b를 2로 바꾸면 a의 값도 바뀌어야하는게 아닌가?

여기서 적용되는게 복제의 개념이다. 위 코드처럼 변수를 대한다면 변수가 저장되는것이 아닌 안의 값만 복제되어서 저장되기 때문에 결국 a와 b는 각자 독립된 값을 저장하고 있게 된다.

변수에 담겨있는 타입이 원시 데이터라면 변수에 변수를 대입할 때 단순히 값의 복제가 일어난다.

하지만 원시 데이터가 아닌 객체인 경우라면 다르게 동작한다.

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

객체 a를 b에 대입하고 b를 통해 값을 변경한 결과 a의 값에도 영향을 주게 되어 2가 출력이 되었다.

이를 참조라고 하며 기존에 있는 객체를 a와 b가 동일하게 저장하고 있기 때문에 a와 b어떠한 것으로 접근해도 값을 변경할 수 있게 된다.

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

당연하게도 b에 a를 대입한 다음 b에 다른 객체를 대입하게 되면 a와 b에는 서로 다른 객체가 저장되어 있어 서로에게 영향을 주지 않는다.

일종의 변수 할당이라고 할 수 있는 메서드의 매개변수가 작동하는 방식을 살펴본다.

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

func(a);
console.log(a);
// 1

a는 1이 저장된 변수이며 func는 매개변수에 2를 대입하는 함수이다.

함수를 호출할때 전달인자로 a를 넣게 되면 a에 2를 대입하는 동작이 진행되므로 이후 a의 출력결과는 2가 나와야 하지만 1이 출력된다.

그 이유는 함수의 매개변수 b에 전달인자 a가 올 때 변수가 참조되는것이 아닌 값의 복제가 이루어지므로 b = a 즉 b = 1의 동작인 것이다.

b = a(1)
b = 1
b(1) = 2
2
// a에는 영향을 주지않는다.  

따라서 func(a)는 a에는 어떠한 영향을 주지 않기 때문에 처음 대입했던 1의 값이 그대로 출력된다.

전달인자가 객체인 경우라면

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

이 경우도 객체를 주고 받지만 함수 내에서 b에는 다시 다른 객체가 할당되기 때문에 a와 b는 독립된 객체로 유지된다.

b = a ({'id':1})
b({'id':1}) = {'id':2}
b({'id':2})

따라서 함수를 통해 객체의 값을 변경하려면 다음과 같이 만들어야한다.

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

func(a)를 통해서 b에는 a와 동일한 객체를 참조하게 되고 b.id로 바꾼 값은 a가 참조하는 객체의 값에도 영향을 주게된다.

[Udemy 강의] 개발자 영어 #2