[JavaScript] 값에 의한 호출(Call by Value)

💡 결론 : Call by Value은 '값'을 전달하는 것, Call by Reference는 '주소값'을 전달하는 것이다. 자바스크립트의 참조타입 변수는 주소값을 '복사'해서 전달한다. 그래서 엄밀히 말하면 Call by Reference가 아니라 Call by Value이다.

💡 주소값을 '복사'해서 전달하는 것과 그냥 전달하는 것의 차이
주소값을 '복사'해서 전달하면 원본과 사본이 독립적으로 움직이게 되고 주소값을 전달하는 것은 같이 움직이게 된다고 이해하면 될 것 같다.

매개변수가 외부 변수를 전달받는 3가지 방식

ⅰ) 외부 변수가 원시 타입인 경우

function 함수(매개변수) {
	매개변수 = 10;
    console.log(매개변수);
}

var 인수 = 5;
함수(인수);
console.log(인수);

원시 값인 인수는 '복사'되어 매개변수에 들어가므로, 원시 값인 인수와 매개변수는 따로 논다.
따라서 함수에 인수가 들어가도 원본인 인수는 값이 변하지 않는다.

ⅱ) 객체의 속성을 수정하는 경우

function 함수(매개변수) {
	매개변수.a = 10;
    console.log(매개변수);
}

var 인수 = {a: 5};
함수(인수);
console.log(인수);

객체타입인 인수를 매개변수에 대입할 때 인수와 매개변수는 '참조관계'가 된다.
이렇듯 객체의 속성을 수정하는 경우 매개변수가 바뀔 때 인수도 따라 바뀐다.
즉, 원본이 수정된다.

하지만, 인수와 매개변수가 참조관계가 된다는 것만으로 Call by Reference라고 할 수 없다. 자바스크립트는 Call by Reference가 아니라는 반례가 iii)의 경우이다.

ⅲ) 객체 자체를 바꾸는 경우

function 함수(매개변수) {
	매개변수 = 8;
    console.log(매개변수);
}

var 인수 = {a: 5};
함수(인수);
console.log(인수); // 맞춰보세요

자바스크립트가 Call by Reference였으면 콘솔에 '8'이 찍혀야 한다.
하지만 이 경우 자바스크립트는 매개변수와 인수가 따로 논다.

정리 : 객체의 '속성'을 수정할 경우에만 인수와 매개변수가 참조관계가 되면서도 같이 움직이지만, 객체 자체를 수정하는 경우에는 인수와 매개변수가 참조관계이기는 하나 이 참조관계가 끊겨 인수와 매개변수가 따로 논다.

객체의 속성을 수정하는 경우 인수와 매개변수가 참조관계가 되어 같이 붙어 먹는(?) ii)의 현상을 Call by Sharing이라고 한다. 하지만 이 용어는 정식 용어가 아니기 때문에 자바스크립트는 Call by Value라고 보는 것이 맞다.

위 내용과 관련한 스터디 영상입니다.
https://youtu.be/t_2A10Bs0j0

더 읽어보면 좋은 자료입니다.
https://spoit.tistory.com/30

참고