Javascript - call by value와 call by reference의 정의

call by value와 call by reference는 프로그래밍을 배우게 되면 꼭 알아야 하는 필수 개념 중 하나입니다. 만약 call by value, call by reference 개념을 잘 이해하지 않고 코드를 작성하면, 의도하지 않은 곳에서 생각지 못한 오류를 만날 확률이 높아집니다. 코드는 논리를 기반으로 동작하기 때문에 정확한 논리가 없다면 의도하지 않은 결과를 내놓기 때문입니다.

 

 처음 프로그래밍을 배우신다면 call by value와 call by reference는 어려울 수 있지만 꼭 알아야 하는 부분입니다. c# 혹은 자바, 하물며 c++ 까지도 이 개념을 사용하고 있다는 점을 잊지 말아 주세요.

 

 만약 아직 자바스크립트에서 이야기하는 변수에 대해서 잘 모르신다면 이전에 발행한 글을 확인하신 후에 이어지는 내용을 확인해주세요. call by value와 call by reference는 변수에 대한 정의를 알아야 하지만 이해할 수 있는 개념입니다.

Javascript - 변수와 상수 그리고 리터럴

call by value - 불변한(immutable) 값

 call by value는 원시(primitive) 형태의 "값"을 사용하는 경우를 이야기합니다. 바로 1, 2, 3 혹은 "a", "b", "c"와 같이 고정적으로 정의하고 사용하는 불변적인 값입니다. 이미 우리는 call by value를 사용해서 코드를 만들고 사용합니다.

function sum(number1, number2) {
  const result = number1 + number2;

  number1 = 0;
  number2 = 0;

  return result;
}

const number1 = 1;
const number2 = 2;

const result = sum(number1, number2);

console.log('number1: ', number1, 'number2: ', number2);
console.log('result: ', result);

 sum()이라는 함수 안에서 매개변수로 전달받은 number1, number2를 변경하는 예제 코드를 만들었습니다. 이 코드를 실행한다면 어떤 결과가 나올지 짐작이 가시나요?

call by value를 사용한 sum()의 실행 결과

 예상하신 결과와 코드 실행 결과가 같다면, 이미 call by value의 개념은 정확히 알고 계십니다. 혹시 예상했던 결과가 number1, number2의 값이 0이라면 아직은 call by value라는 개념에 아직 익숙지 않으신 것뿐입니다.

 

 call by value는 원본 "값"과 동일한 값을 복사해서 사용하는 개념입니다. 그렇기 때문에 값을 전달받은 함수나 단락(block)에서 아무리 값을 변경해도 복사해서 가져온 값이 수정될 뿐 원본(original)에는 아무런 영향이 생기지 않습니다.

 

 

call by referenece - 불변하지 못한(mutable) 값

 call by reference는 참조(reference) 값을 사용하는 경우를 말합니다. 앞서 이야기한 call by value와는 정반대인 상황이라고 이야기할 수 있습니다. 값 자체는 문제가 없습니다. 다만 값이 원시(primitive)가 아닌 참조(reference)입니다. 예를 들면 0x00과 같은 주소 값입니다.

function sum(obj) {
  const result = obj.number1 + obj.number2;

  obj.number1 = 0;
  obj.number2 = 0;

  return result;
}

const obj = {
  number1: 1,
  number2: 2,
}

const result = sum(obj);

console.log('number1: ', obj.number1, 'number2: ', obj.number2);
console.log('result: ', result);

 이번에도 값을 전달해 합산을 합니다. call by value랑 다른 부분은 obj라는 객체를 매개변수로 사용했다는 점입니다. 이 코드는 실행하면 결과가 어떻게 나올까요?

call by value를 사용한 sum()의 실행 결과

 call by reference의 예제 코드 실행 결과는 call by value를 설명하는 예제 코드와 결과가 다릅니다. 단지 obj를 매개변수로 사용했을 뿐입니다. 왜 실행되는 기능은 같은데 다른 결과를 보여주는 걸까요?

 

 call by reference도 call by value와 동일하게 원본 값을 복사해서 사용하지만, 원본 값이 가리키는 대상이 그냥 "값"이냐 아니면 "주소 값"이냐가 다릅니다.

 

 예를 들자면 그냥 값을 복사해서 사용하는 경우는 똑같은 축구공을 여러 개 만들어서 쓰는 상황과 같고, 주소 값을 복사해서 사용하는 경우는 똑같은 열쇠를 여러 개 만들어서 쓰는 상황과 같습니다. 축구공은 모르는 누군가 공을 가져가도 공을 가져가는 걸로 상황이 끝이 나지만, 열쇠는 모르는 누군가에게 주면 어떤 일이 생길지 몰라 불안과 공포심을 가져야 합니다.

 

위에서 call by value와 call by reference의 정의를 설명하기 위한 예제 코드는 압축 파일로 첨부하였습니다. 필요하신 분은 첨부파일을 다운로드 받아 사용하세요.

예제 코드.zip

0.00MB

정리하기

 call by value와 call by reference의 정의를 알아보았습니다. 다시 한번 정리하자면 call by value와 call by reference는 "값"을 매개변수로 사용하는 상황을 이야기하며, 이때 사용되는 값이 "값"을 사용하느냐 "참조 값"을 사용하느냐에 따라 by value 혹은 by reference라고 정의합니다. 

 

 사실 정의만으로는 왜 이 개념이 중요한지 알기가 어렵습니다. call by value와 call by reference 개념이 중요한 이유는 차이점을 확인해보면 분명하게 알 수 있는데요. 다음 글에서는 몇 가지의 상황과 이미지를 통해 call by value와 call by reference의 차이점을 알아보도록 하겠습니다.