자바스크립트 기본 문법 – 함수 – 1 – 매개변수와 인수
소제목: 매개변수와 인수의 개념과 활용
매개변수와 인수는 자바스크립트 함수에서 중요한 개념입니다. 매개변수는 함수를 정의할 때 괄호 안에 선언되는 변수이며, 인수는 함수를 호출할 때 전달되는 값입니다. 이해를 돕기 위해 한 가게 주인 아저씨와 손님들의 대화를 예시로 들어볼게요.
아저씨: “안녕하세요! 저는 한 가게의 주인 아저씨입니다. 제 가게에는 다양한 메뉴가 있어요. 그런데 메뉴를 주문하실 때, 어떤 메뉴를 원하는지 저에게 알려줘야 해요. 그러니까 매개변수는 주문할 때 필요한 정보를 나타내는 것이라고 생각하면 돼요.”
손님1: “안녕하세요! 저는 손님1이에요. 주인 아저씨, 제가 햄버거를 주문하고 싶어요. 햄버거가 매개변수라면, 제가 주문한 햄버거의 종류가 인수인 건가요?”
아저씨: “네, 정확히 맞아요! 매개변수는 함수에 전달되는 정보를 받는 변수이고, 인수는 그 실제 값을 의미해요. 예를 들어, 함수를 정의할 때 햄버거라는 메뉴를 주문받는 매개변수를 선언하면, 그 매개변수에 실제 주문한 햄버거의 종류가 인수로 전달될 거에요.”
손님2: “아저씨, 그럼 매개변수는 여러 개일 수도 있을까요?”
아저씨: “네, 맞아요! 함수에 따라 필요한 매개변수의 개수와 종류가 달라질 수 있어요. 예를 들어, 햄버거의 종류뿐만 아니라 토핑, 사이즈, 소스 등 여러 가지 정보가 필요하다면, 각각의 정보를 나타내는 매개변수를 선언할 수 있어요.”
소제목: 매개변수와 인수의 사용 방법
매개변수와 인수를 사용하는 방법에 대해 알아보겠습니다.
아저씨: “손님들, 매개변수와 인수를 사용하는 방법에 대해 설명해드릴게요.”
손님1: “네, 기다렸어요! 어떻게 사용하면 되는 건가요?”
아저씨: “함수를 정의할 때 매개변수를 괄호 안에 선언하고, 함수를 호출할 때 인수를 전달해주면 돼요. 예를 들어, 햄버거를 주문받는 함수를 만들 때, 햄버거 종류를 나타내는 매개변수를 선언하고, 함수를 호출할 때 실제 주문한 햄버거 종류를 인수로 전달하면 되는 거죠.”
손님2: “아저씨, 그럼 매개변수의 이름은 어떻게 정해야 할까요?”
아저씨: “매개변수의 이름은 개발자가 마음대로 정할 수 있어요. 다만, 주로 매개변수 이름은 해당 값을 잘 표현할 수 있는 이름으로 지어주는 게 좋아요. 예를 들어, ‘햄버거종류’라는 이름은 햄버거의 종류를 나타내는 데 좋은 이름이겠죠?”
소제목: 매개변수와 인수를 활용한 예제
실제 예제를 통해 매개변수와 인수의 사용 방법을 살펴보겠습니다. 아저씨와 손님들의 대화를 이어가면서 예시를 설명해볼게요.
아저씨: “손님들, 실제 예제를 통해 매개변수와 인수의 사용 방법을 보여드릴게요.”
손님1: “오, 실전 예제예요! 기대돼요.”
아저씨: “예를 들어, 햄버거의 가격을 계산하는 함수를 만들어볼까요? 그러면 매개변수로는 햄버거의 종류와 수량, 인수로는 실제 주문한 햄버거의 종류와 수량을 전달하면 될 거에요. 그러면 함수 안에서는 매개변수를 활용하여 가격을 계산할 수 있어요.”
손님2: “아저씨, 그렇게 함수를 만들고 호출하려면 어떻게 해야 할까요?”
아저씨: “함수를 만들 때는 function
키워드를 사용하고, 매개변수는 괄호 안에 선언하면 돼요. 그리고 함수를 호출할 때는 함수 이름을 적고 괄호 안에 인수를 전달하면 되요. 함수 안에서는 매개변수를 사용하여 원하는 작업을 수행하면 됩니다.”
손님1: “아저씨, 함수를 만들고 호출하는 과정을 더 자세히 알려주세요.”
아저씨: “네, 예제를 통해 자세히 설명해드릴게요.
function calculatePrice(burgerType, quantity) {
// 햄버거 종류와 수량을 매개변수로 받아서 가격을 계산하는 함수
var price = 0;
if (burgerType === '치즈버거') {
price = 5000;
} else if (burgerType === '불고기버거') {
price = 5500;
} else if (burgerType === '치킨버거') {
price = 6000;
}
var totalPrice = price * quantity;
return totalPrice;
}
var myBurgerType = '치즈버거';
var myQuantity = 2;
var myTotalPrice = calculatePrice(myBurgerType, myQuantity);
console.log(myTotalPrice); // 출력 결과: 10000
위의 예제에서 calculatePrice
라는 함수를 만들었어요. 이 함수는 burgerType
과 quantity
라는 두 개의 매개변수를 받아와서 햄버거 가격을 계산한 뒤, 그 결과를 반환하는 함수입니다. 함수를 호출할 때 myBurgerType
과 myQuantity
라는 인수를 전달하여 실제 주문한 햄버거 종류와 수량을 전달했어요. 그리고 반환된 가격을 myTotalPrice
에 저장하여 출력했더니 10000이라는 결과가 나왔어요.”
손님2: “아저씨, 함수를 호출할 때 전달하는 인수의 개수와 순서는 중요한 건가요?”
아저씨: “네, 인수의 개수와 순서는 매우 중요해요. 함수를 호출할 때는 매개변수의 개수와 순서에 맞춰서 인수를 전달해야 해요. 인수의 개수가 매개변수의 개수와 다르거나, 순서가 맞지 않으면 원하는 결과를 얻을 수 없을 거에요.”
주의해야 할 점
- 매개변수와 인수의 개수와 순서를 정확히 맞춰야 합니다. 인수의 개수가 매개변수의 개수와 다르거나, 순서가 맞지 않으면 원하는 결과를 얻을 수 없습니다.
- 매개변수의 이름은 해당 값을 잘 표현할 수 있는 이름으로 지어주는 것이 좋습니다. 이렇게 하면 코드를 읽을 때 이해하기 쉬워집니다.
- 함수를 호출할 때 인수를 전달하는 과정에서 값을 빠뜨리거나 잘못 전달하는 실수를 주의해야 합니다.
자바스크립트의 매개변수와 인수 개념을 이해하고 활용하는 방법에 대해 알아보았습니다. 이제 함수를 작성하고 호출할 때 매개변수와 인수를 올바르게 다룰 수 있을 것입니다. 계속해서 자바스크립트의 다른 주제들도 탐구해보세요! 화이팅!