Javascript ES6 - Default Parameter & Arguments

1️⃣  Default Parameter

 

function add (a,b) {
	console.log(a+b);
}

add(1,2);

 

함수를 만들고 그 함수를 실행하기 위해선 보통 함수의 parameter에 맞게 인자를 넣어주는 것이 일반적입니다. 그런데 Default Parameter를 사용하면 함수의 parameter의 개수에 맞지 않게 인자를 넣어주어도 함수를 실행할 수 있습니다.

 

function add (a, b = 10){
  console.log(a + b)
}

add(1); // 결과: 11

 

위 코드를 보면 함수를 만들 때 parameter에 b=10 을 넣어준 것을 알 수 있습니다. 이것의 뜻은 ‘b 값을 넣으면 그 넣은 값을 사용하고, 만약 b 값을 넣지 않으면 그 때는 10을 사용해라’ 라고 해석할 수 있습니다. 따라서 함수를 실행할 때 b 값을 넣어주지 않았기 때문에 b=10을 사용해서 1+10 을 계산한 11이 결과로 나오는 것을 볼 수 있습니다.

 

function add (a, b = 2 * 5){
  console.log(a + b);
}

add(1); // 결과: 11

 

Default parameter는 이런 식으로 연산을 이용해서도 지정해놓을 수 있습니다.

 

function add (a, b = 2 * a){
  console.log(a + b);
}

add(3);

 

연산을 이용하는 것을 넘어서 a값에 따라 b의 default parameter를 바뀌게 할 수도 있습니다.

 

function tempFunc(){
  return 10;
}

function add (a, b = tempFunc() ){
  console.log(a + b);
}

add(3);

 

Default Parameter에는 함수도 넣을 수 있습니다. Default Parameter의 정의에 따라 역시나 b의 값이 없을 때만 함수가 실행됩니다. 함수를 넣을 때는 ( ) 까지 꼭 넣어줘야 합니다.

 

 

2️⃣  Arguments

 

Arguments는 함수의 parameter들을 한꺼번에 다루고 싶을 때 사용하는 문법입니다. Arguments의 정체는 함수의 parameter들을 [ ] 에 담아놓은 변수라고 생각하면 됩니다. 그렇다고 실제로 배열은 아닙니다.

 

function exFunc(a,b,c){
  console.log(arguments[0]);
}

exFunc(2,3,4);

 

이런 코드가 있을 때 결과로는 2가 출력됩니다. 현재 함수의 parameter로 들어간 값이 2, 3, 4 인데 그것을 arguments에 [ ] 형식으로 담았고 그것의 첫번째 요소는 2이기 때문입니다.

 

이를 응용해서 모든 parameter를 출력하고 싶다면 반복문을 이용해서 출력할 수 있습니다.

 

function exFunc (a,b,c) {
	for (let i= 0; i<arguments.length; i++) {
		console.log(arguments[i]);
	}
}

 

이렇게 코드를 작성하면 모든 parameter가 출력이 됩니다.