본문 바로가기

코딩도 합니다/JS

[자바스크립트 js] 파라미터 Parameter와 아규먼트 Argument 차이 / 파라미터의 기본값



  1. 파라미터와 아규먼트의 차이

function greeting(name) { //name은 파라미터
	console.log(`Hi! My name is ${name}!`);
}

greeting('뚝딱'); //뚝딱, tooktak, TOOKTAK 모두 Argument(인자)
greeting('tooktak');
greeting('TOOKTAK');
  • 함수선언 부분에서 소괄호 안에 작성 되는 것이 파라미터.
  • 함수호출 부분에서 소괄호 안에 작성 되는 것이 아규먼트.

 

 

 

  2. 파라미터의 기본 값

  • 자바스크립트에서 함수의 파라미터는 기본값을 가질 수 있다.
  • 기본값이 있는 파라미터는 함수를 호출할 때,
    아규먼트를 전달하지 않으면 기본값을 가지고 동작한다.

 

2-1. 기본값 설정 안 했을 때

function greeting(name) {
	console.log(`Hi! My name is ${name}!`);
}

greeting();



// Hi! My name is undefined!

 

 

2-2. 기본값 설정 했을 때

function greeting(name = 'Tooktak') {
	console.log(`Hi! My name is ${name}!`);
}

greeting();



// Hi! My name is Tooktak!

 

 

2-3. 하나 이상의 파라미터가 존재할 때

아규먼트를 부분적으로 생략할 경우는 아래와 같이 출력 된다.

즉, 아규먼트를 생략될 가능성이 있어서 기본값이 필요한 파라미터는 가급적 오른쪽에 작성하기.

function greeting(korean = '뚝딱', english) {
	console.log(`안녕! 내 이름은 ${korean}!`);
    console.log(`Hi! My name is ${english}!);
}

greeting('TOOKTAK');



// 안녕! 내 이름은 TOOKTAK!
// Hi! My name is undefined!

 

 

 

2-4. 기본값을 사용하고 싶을 때

undefined를 활용한다.

function greeting(korean = '뚝딱', english) {
	console.log(`안녕! 내 이름은 ${korean}!`);
    console.log(`Hi! My name is ${english}!);
}

greeting(undefined, 'TOOKTAK');



// 안녕! 내 이름은 뚝딱!
// Hi! My name is TOOKTAK!

 

728x90