[JavaScript] 매개변수

Rachaen·2023년 1월 11일
0

매개변수란?

함수에 전달된 인수에 해당하는 Array 형태의 객체

함수의 매개변수 개수를 넘어가는 인수

  • 오류를 일으키지 않고 무시됨
function add(a, b) {
  return a + b;
}

console.log(
  add(1, 3),
  add(1, 3, 5),
  add(1, 3, 5, 7)
);

기본값 매개변수(Default parameters)

  • 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있다.
  • 함수가 호출될 때마다 새로운 객체가 생성된다.
function multiply(a, b = 1) {
  return a * b;
}

console.log(multiply(5, 2));
// expected output: 10

console.log(multiply(5));
// expected output: 5

지역 변수(arguments)

  • 배열의 형태를 한 객체(엄연히 배열은 아니지만.. 배열처럼 동작)
  • 함수 호출 시 전달된 모든 인수들을 배열 형태로 가짐
function func1(a, b, c) {
  console.log(arguments[0]);
  // expected output: 1

  console.log(arguments[1]);
  // expected output: 2

  console.log(arguments[2]);
  // expected output: 3
}

func1(1, 2, 3);
// 💡 타입에 안전한 버전
function getAverage() {
  let result = 0, count = 0;
  for (const num of arguments) {
    if (typeof num !== 'number') continue;
    result += num;
    count++;
  }
  return result / count;
}

console.log(
  getAverage(2, '가', 8, true, 5)
);
  • for...of가 가능한 이유: iterable이기 때문!
  • 화살표 함수에서는 arguments 사용 불가!

나머지 매개변수(rest parameters)

  • 함수의 마지막 매개변수 앞에 "..."를 붙이면 모든 후속 매개변수를 배열에 넣도록 지정
  • 마지막 매개변수만 나머지 매개변수로 설정할 수 있음
function myFun(a, b, ...manyMoreArgs) {
  console.log("a", a);
  console.log("b", b);
  console.log("manyMoreArgs", manyMoreArgs);
}

myFun("one", "two", "three", "four", "five", "six");

// 콘솔 출력:
// a, one
// b, two
// manyMoreArgs, [three, four, five, six]

나머지 매개변수와 arguments 객체의 차이

  • arguments 객체는 실체 배열이 아니다! 그러나 나머지 매개변수는 Array. 인스턴스이므로 sort, map, forEach, pop 등의 메서드를 직접 적용할 수 있다.
  • arguments 객체는 callee 속성과 같은 추가 기능을 포함한다
  • ...restParam은 후속 매개변수만 배열에 포함하므로 ...restParam 이전에 직접 정의한 매개변수는 포함하지 않는다. 그러나 arguments 객체는, ...restParam의 각 항목까지 더해 모든 매개변수를 포함한다.

mdn 기본값 매개변수
mdn arguments 객체
나머지 매개변수
profile
개발을 잘하자!

0개의 댓글