JavaScript

#13 자바스크립트(JavaScript) - 매개변수, 인수

에이블디 2022. 4. 5. 11:58

안녕하세요 여러분! 에이블디 입니다!

 

이번 시간에는 매개변수와 인수에 대해 알아보려고 해요!

 

지난 시간에 함수에 대해 배워보면서 함수는 자주 사용하는 기능에 필요한 여러 가지 코드를 하나의 함수에 넣어서 만들어 사용한다는 것 기억하시나요?

 

그런데 지난 시간에 예제 코드에서는 함수를 호출할 때마다 '1 + 1'의 고정된 수식을 가지고 실행했기 때문에 '2'라는 고정값밖에 출력을 할 수 없었는데요, 이번 시간에는 함수를 여러 번 재사용할 수 있도록 매개변수와 인수에 대해 배워보는 시간을 가져볼게요!

 

재사용이 가능한 두 수를 더하는 함수를 선언하기 위해서는 더해줄 값 두 개가 필요하겠죠?

그래서 값 두개가 필요하다고 미리 지정을 해 두어야 하는데요, 이렇게 함수를 실행하기 위해 필요하다고 지정하는 값을 매개변수라고 합니다.

파라 매터(Parameter)라고도 하는데요, 매개변수를 지정하려면 함수를 선언할 때 함수 이름 옆의 소괄호() 안에 변수 이름을 넣어주면 됩니다.

 

그럼 어제 코드를 조금 수정해서 재사용성이 가능한 두 수를 더하는 함수를 선언해 볼까요?

function sumNumber(a, b){
    var sum = a + b;
    console.log(sum);
}

함수를 선언했으니 이제 함수를 호출하여 실행시켜 봐야겠죠?

 

매개변수가 있는 함수를 호출할 때는 함수 이름 옆의 소괄호() 안에 매개변수에 할당할 값을 넣어 주면 됩니다!

위에서 선언한 sumNumber() 함수는 매개변수가 a와 b 2개이죠?

그럼 sumNumber() 함수를 호출할 때 소괄호 안에 두 개의 값을 넣어주면 됩니다.

 

한번 작성해 보도록 할게요!

지난 시간에는 1과 1을 더했으니 이번엔 1과 2를 더해볼게요.

sumNumber(1, 2);

1과 2를 더해줄 거기 때문에 변수 a의 자리에는 1을, 변수 b의 자리에는 2를 넣어 코드를 작성했는데요, 이렇게 함수를 호출할 때 매개변수로 넘겨주는 값을 인수(Argument)라고 합니다.

 

정리를 해보자면

 

 

1. 매개변수

2. 인수

라고 정리해 볼 수 있겠네요!

 

그럼 실행을 한번 시켜 볼까요?

 

 

매개변수에 인수 1과 2를 넘겨받아 1 + 2이 계산되어 3이 출력되는 것을 확인할 수 있습니다!

 

재사용이 되는 것을 확인하기 위해 인수 값을 몇 가지 더 바꿔서 실행시켜 볼게요!

function sumNumber(a, b){
    var sum = a + b;
    console.log(sum);
}

sumNumber(1, 2);
sumNumber(3, 4);
sumNumber(5, 6);
sumNumber(7, 8);
sumNumber(9, 10);

인수값에 따라 다른 결과를 보여주는 걸 확인할 수 있고, sumNumber() 함수가 재사용이 되는것도 확인 할 수 있네요!

 

이번 시간에는 매개변수와 인수에 대해 알아보았습니다!

 

다음 시간에는 함수를 활용하는 방법에 대해 조금 더 알아보도록 할게요!