1. default 파라미터

default 파라미터는 함수를 만들 때 파라미터의 기본값을 설정할 수 있는 문법이다.
실수로 파라미터를 적지 않아도 설정해놓은 기본값을 넣어준다.

예시로 파라미터를 받아서 덧셈결과를 콘솔창에 출력하는 함수를 만들었다.

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

add(3, 5); // 8
add(3) // 13

위와 같이 파라미터에 =로 값을 넣어주면 된다.

파라미터를 제대로 넣으면 파라미터에 맞게 덧셈연산을 하지만 하나만 넣을 경우 b = 10 라는 설정해놓은 기본값으로 연산을 진행한다.

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

add(); // 15

위 코드와 같이 모든 파라미터에 기본값을 주면 파라미터를 아무것도 전달하지 않아도 설정해놓은 기본값으로 덧셈연산을 진행한다.

function add (a, b = 2 * 5){} // 수학연산자 사용가능
function add (a, b = 2 * a){} // 파라미터와의 연산 가능

function returnTen(){
  return 10 
}
function add (a, b = returnTen() ){} // 함수도 입력 가능

위와 같이 다양한 값들을 기본값으로 설정할 수 있다.

2. arguments

ES5 문법

arguments는 입력된 모든 파라미터를 []안에 넣어준다.
함수의 파라미터들을 한꺼번에 다루고 싶은 경우 사용한다.

함수 안에서 쓸 수 있는 미리 정의된 키워드로 arguments 그대로 입력하여 사용할 수 있다.

function arg(a, b, c, d) {
  console.log(arguments);
  // 1. 모든 파라미터 []안에 출력
  
  console.log(arguments[0]);
  console.log(arguments[1]);
  console.log(arguments[2]);
  console.log(arguments[3]);
  // 2. 인덱싱을 이용하여 개별 출력 가능
  
  for (let i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
    // 3. 반복문을 이용하여 모든 파라미터 개별 출력
  }
}

arg(1, 2, 3, 4);

1. 모든 파라미터 [ ]안에 출력

   

2. 인덱싱을 이용하여 개별 출력 가능

   

3. 반복문을 이용하여 모든 파라미터 개별 출력

   

3. Rest 파라미터

ES6에서 등장한 arguments보다 파라미터를 더 쉽게 다룰 수 있는 문법이다.

rest파라미터는 파라미터 왼쪽에 ... 점 3개를 붙여 쓰는데 spread 연산자와 똑같이 생겼다.

함수 파라미터 자리에 쓰면 rest파라미터이다. 나머지 경우에는 spread이다.

rest파라미터는 함수 안에 들어온 파라미터를 전부 담은 array를 출력한다.

function rest(...params){
  console.log(params);
  // 1. 모든 파라미터 []안에 출력
  
  console.log(params[0]);
  console.log(params[1]);
  console.log(params[2]);
  // 2. 인덱싱으로 개별 출력 가능
  
  for (let i = 0; i < rest.length; i++){
    console.log(rest[i]);
    // 3. 반복문을 이용하여 모든 파라미터 개별 출력
  }
}

rest(1,2,3);

1. 모든 파라미터 [ ]안에 출력

   

2. 인덱싱으로 개별 출력 가능

   

3. 반복문을 이용하여 모든 파라미터 개별 출력

   

파라미터를 추가할 경우

function rest(a, b, ...params) {
  console.log(params);
}

rest(1, 2, 3, 4, 5);

결과

• a, b 자리에 위치한 파라미터를 제외한 나머지 파라미터만 출력된다.

arguments와 차이점 정리

• arguments

  • 함수 생성시 파라미터 개수를 정해야한다.
  • 모든 파라미터를 []에 담아준다.

• rest parameter

  • 함수 생성시 파라미터 개수를 정하지 않아도 된다.
  • 이 자리에 위치한 모든 파라미터를 []에 담아준다.

위의 이유로 보다 유연하게 사용할 수 있다.

주의사항

1. 마지막 파라미터에만 사용할 수 있다.

function rest(a, ...params, b){} // X
function rest(a, b, ...params){} // O

2. 하나만 사용할 수 있다.

function rest(a, ...params1, ...params2){} // X
function rest(a, ...params1){} // O