JavaScript의 Parameter와 Argument: 헷갈리는 개념 완벽 정리
들어가며: Parameter vs Argument
오늘은 JavaScript 세계에서 자주 마주치지만 때로는 혼란스러워하는 두 가지 개념에 대해 이야기해보려고 합니다. 바로 'parameter'와 'argument'입니다.
"함수를 만들 때 괄호 안에 넣는 게 parameter인가? argument인가?"
"이 둘의 차이점은 뭐지? 그냥 같은 거 아닌가?"
이런 질문들로 고민해 본 적 있으신가요? 걱정 마세요. 오늘 이 포스트를 읽고 나면, 이 두 개념을 명확히 구분할 수 있게 될 겁니다. 자, 그럼 JavaScript 함수의 세계로 빠져볼까요?
Parameter vs Argument: 정의부터 확실히!
Parameter (매개변수)
- 정의: 함수를 선언할 때 사용되는 변수
- 위치: 함수 선언부의 괄호 () 안에 위치
- 역할: 함수 내부에서 사용될 값을 받아들이는 '창구' 역할
Argument (인수)
- 정의: 함수를 호출할 때 전달하는 실제 값
- 위치: 함수 호출 시 괄호 () 안에 위치
- 역할: 함수에 전달되어 parameter에 할당되는 실제 데이터
실제 예제로 이해하기
// 함수 선언
function greet(name) { // 여기서 'name'이 parameter
console.log(`안녕하세요, ${name}님!`);
}
// 함수 호출
greet("영희"); // 여기서 "영희"가 argument이 예제에서:
name은 parameter입니다. 함수가 받아들일 값의 자리표시자 역할을 합니다."영희"는 argument입니다. 실제로 함수에 전달되는 값이죠.
왜 이런 구분이 중요할까?
-
함수의 재사용성: Parameter를 사용함으로써 함수를 더 유연하게 만들 수 있습니다. 다양한 argument를 받아 처리할 수 있게 되죠.
-
코드의 가독성: Parameter의 이름을 통해 함수가 어떤 데이터를 기대하는지 명확히 알 수 있습니다.
-
디버깅: Parameter와 argument를 구분함으로써 함수 호출 시 발생하는 문제를 더 쉽게 추적할 수 있습니다.
주의할 점: Parameter와 Argument의 수
JavaScript에서는 parameter와 argument의 수가 일치하지 않아도 에러가 발생하지 않습니다. 하지만 이는 예상치 못한 결과를 초래할 수 있죠.
function introduce(name, age) {
console.log(`${name}님은 ${age}살입니다.`);
}
introduce("지민", 25); // 정상 출력: 지민님은 25살입니다.
introduce("수진"); // 부분 출력: 수진님은 undefined살입니다.
introduce("민수", 30, "서울"); // 추가 인자 무시: 민수님은 30살입니다.실전 팁: Default Parameter 사용하기
ES6부터는 default parameter를 사용할 수 있어, argument가 전달되지 않았을 때의 상황을 우아하게 처리할 수 있습니다.
function greet(name = "익명의 사용자") {
console.log(`안녕하세요, ${name}님!`);
}
greet(); // 출력: 안녕하세요, 익명의 사용자님!
greet("동욱"); // 출력: 안녕하세요, 동욱님!마치며: 함수가 받아들일 값 vs 함수에 전달되는 값
Parameter와 argument의 차이를 이해하는 것은 단순히 용어를 구분하는 것 이상의 의미가 있습니다. 함수의 작동 방식을 더 깊이 이해하고, 더 나은 코드를 작성하는 첫 걸음이 될 수 있습니다.
이제 이 두 개념을 확실히 구분할 수 있게 되었습니다. 다음에 함수를 작성하거나 사용할 때, 이 차이점을 생각해보세요. 그리고 이를 통해 어떻게 더 효율적이고 명확한 코드를 작성할 수 있을지 고민해보는 것은 어떨까요?
코딩의 세계는 이런 작은 개념들의 이해에서부터 시작됩니다. 여러분의 JavaScript 여정에 이 포스트가 도움이 되었기를 바랍니다. 다음에는 또 다른 흥미로운 주제로 찾아뵙겠습니다. 행복한 코딩 되세요!
