[JavaScript] 매개변수

1. 매개변수(Parameter, 인자)

 

함수의 작업 실행을 위해 추가적인 정보가 필요할 경우, 매개변수를 지정한다. 매개변수는 함수 내에서 변수와 동일하게 동작한다. 

 

2. 매개변수(parameter, 인자) vs 인수(argument)

매개변수는 함수 내에서 변수와 동일하게 메모리 공간을 확보하며 함수에 전달한 인수는 매개변수에 할당된다. 만약 인수를 전달하지 않으면 매개변수는 undefined로 초기화된다.

var foo = function (p1, p2) {
  console.log(p1, p2);
};

foo(1); // 1 undefined

3. Call-by-value

원시 타입 인수는 Call-by-value(값에 의한 호출)로 동작한다. 이는 함수 호출 시 원시 타입 인수를 함수에 매개변수로 전달할 때 매개변수에 값을 복사하여 함수로 전달하는 방식이다. 이때 함수 내에서 매개변수를 통해 값이 변경되어도 전달이 완료된 원시 타입 값은 변경되지 않는다.

function foo(primitive) {
  primitive += 1;
  return primitive;
}

var x = 0;

console.log(foo(x)); // 1
console.log(x);      // 0

4. Call-by-reference

객체형(참조형) 인수는 Call-by-reference(참조에 의한 호출)로 동작한다. 이는 함수 호출 시 참조 타입 인수를 함수에 매개변수로 전달할 때 매개변수에 값이 복사되지 않고 객체의 참조값이 매개변수에 저장되어 함수로 전달되는 방식이다. 이때 함수 내에서 매개변수의 참조값이 이용하여 객체의 값을 변경했을 때 전달되어진 참조형의 인수값도 같이 변경된다.

function changeVal(primitive, obj) {
  primitive += 100;
  obj.name = 'Kim';
  obj.gender = 'female';
}

var num = 100;
var obj = {
  name: 'Lee',
  gender: 'male'
};

console.log(num); // 100
console.log(obj); // Object {name: 'Lee', gender: 'male'}

changeVal(num, obj);

console.log(num); // 100
console.log(obj); // Object {name: 'Kim', gender: 'female'}

 

const flight = "LH234";
const kchmin = {
    name: 'Kim minsu',
    passport: 12345678
}

const checkIn = function(flightNum, passenger){
    flightNum = 'LH999';
    passenger.name = 'Mr. ' + passenger.name;

    if(passenger.passport === 12345678){
        alert('Check in')
    } else {
        alert(' Wrong passport!');
    }
}

checkIn(flight, kchmin); 
console.log(flight); // LH234
console.log(kchmin); // name: Mr. Kim minsu, passport: 12345678

checkIn() 함수을 실행 한 뒤, 2개를 출력해보았습니다.

위의 각각의 출력문 결과는 name: Mr. Kim minsu, passport: 12345678 가 나오게 됩니다.

그 이유는 filght는 checkIn에서 재정의를 했어도 그대로 전에 정의했던 결과가 나오고,

밑의 kchmin 객체는 바뀐 결과가 나오게 됩니다.

이렇게 결과에서 차이가 나는 이유는 flight는 String이여서 primitive type이다. 매개변수의 값을 함수에 전달했을 때, 

flightNum 은 기본적으로 원래 값을 그대로 복사한 복사본입니다. 따라서 flightNum에는 아래와 같이 단순히 flightNum 변수의 원래 값이 아닌 복사본이 포함되게 됩니다. 

const flightNum = flight;

그리고 함수내의 flightNum은 완전히 다른 변수가 되게 됩니다. 그러므로 외부에 있는 flight 변수와 상관없이 flightNum은 영향을 받지 않게 됩니다. 정확한 이유로는 primitive와 reference type의 차이입니다. 

반면에 kchmin 객체는 reference type이 함수를 지나갈 때에는, 복사되는 것은 실제로 메모리 heap의 참조만 복사하게 됩니다.

이 의미는 아래와 같습니다.

const passenger = kchmin;

 이것의 의미는 실제로 메모리 heap의 해당 객체에 대한 참조만 복사합니다. 

이 의미는, passenger 객체를 조작하는게, kchmin 객체를 조작하는 것과 같다는 의미입니다. 

 

참고

• poiemaweb.com/js-function