JavaScript 선택적 함수 매개변수

Daneesha Perera 2023년10월12일

JavaScript JavaScript Function

JavaScript 선택적 함수 매개변수
결론

선택적 함수 매개 변수를 초기화하면 코드를 더 쉽게 구현할 수 있고 코드의 가독성이 향상되며 오류 및 반복 없이 코드를 단순화할 수 있습니다. 수많은 인수와 매개변수를 추가하여 코드를 사용자 정의할 수 있습니다.

이 기사에서는 JavaScript에서 선택적 함수 매개변수를 사용하는 방법에 대해 설명합니다.

JavaScript 선택적 함수 매개변수

매개변수는 함수를 정의하는 데 사용되는 정의입니다. JavaScript에서는 함수 호출에서 두 가지 주요 매개변수를 사용합니다. 필수 및 선택적 매개변수입니다.

필수 매개변수를 전달해야 합니다. 그렇지 않으면 오류가 발생합니다. undefined를 반환하지만 선택적 매개변수에서 매개변수가 없거나 정의되지 않은 경우 기본값으로 초기화됩니다.

선택적 함수 매개변수를 선언할 때 주로 세 가지 접근 방식을 취할 수 있습니다.

정의되지 않은 속성 사용
인수 변수 사용
논리 OR 연산자 사용

정의되지 않은 속성 사용

JavaScript에서 함수를 호출할 때 매개변수를 생략하고 정의되지 않음 값으로 나머지 매개변수를 채울 수 있습니다.

암호:

function number(num1, num2) {
  if (num1 === undefined) {
    num1 = 2;
  }
  if (num2 === undefined) {
    num2 = 2;
  }
  return num1 * num2;
}

console.log(number(5, 6));
console.log(number(5));

출력:

30
10

위 스니펫에서 number() 함수가 두 번 호출됩니다. 처음에는 num1 및 num2에 대한 두 개의 매개변수를 함수에 전달하고 num1에 대해 하나의 매개변수만 할당했습니다.

코드가 잘 작동하고 첫 번째 호출에서 출력이 30으로 표시되지만 두 번째 호출에서는 주어진 값을 num1로 간주한 후 값 10을 표시합니다. 함수가 숫자 변수가 정의되지 않았는지 여부를 확인할 때 num2 값은 2로 유지됩니다.

그러나이 방법을 사용하면 마지막 인수 만 선택적으로 만들 수 있으며 매개 변수의 첫 번째, 중간 또는 조합을 선택적으로 만들 수 없습니다.

인수 변수 사용

인수는 JavaScript 함수에 내장된 개체입니다. 함수 호출 시 매개변수 배열을 반환합니다.

이 배열의 길이는 전달된 매개변수의 수를 나타냅니다. 조건문을 사용하여 전달된 매개변수의 수를 확인하고 정의되지 않은 매개변수 대신 기본값을 전달합니다.

그런 다음 인수 개체를 반복하면서 모든 매개 변수를 찾을 수 있습니다.

암호:

function number(num1, num2) {
  if (arguments.length == 0) {
    num1 = 1;
    num2 = 2;
  }

  if (arguments.length == 1) {
    num2 = 2;
  }

  return num1 * num2;
}

console.log(number(10, 15));  // first calling
console.log(number(10));      // second calling

출력:

150
20

위 스니펫에 따르면 number() 함수는 arguments.length 속성에 사용된 매개변수의 수를 확인합니다. 결과가 0이 되면 함수에 매개변수가 전달되지 않습니다. 1이 되면 num1 매개변수만 전달됩니다.

그 후 매개변수 2개와 1개를 가져와서 number() 함수를 두 번 호출합니다. 첫 번째 호출에서도 제대로 작동했고 출력이 150으로 표시되었습니다. 두 번째 호출에서는 arguments.length가 1과 같기 때문에 num2에 2를 할당한 후 20으로 결과를 표시했습니다.

논리 `OR`(`||`) 연산자 사용

이 방법에서 선택적 매개변수는 함수 본문 내의 기본값이 있는 논리 OR(||)입니다. 여기서 단락 OR 연산자는 왼쪽 인수의 왼쪽이 true인 경우 true를 반환합니다. 그렇지 않으면 오른쪽 인수가 true인 경우 true를 확인하고 반환합니다.

OR 연산자를 사용하면 유연하고 읽기 쉬운 선택적 인수를 생성할 수 있는 간단한 방법이며 선택적 매개변수를 쉽게 관리할 수 있습니다. 또한 False , 0 , null , undefined , 빈 문자열 " " 및 NaN 은 모두 유효하지 않은 인수입니다.

코드(첫 번째 호출):

function multiply(num1, num2) {
  var num3 = num2 || 2;
  return num1 * num3;
}
console.log(multiply(10, 20));

출력:

코드(두 번째 호출):

function multiply(num1, num2) {
  var num3 = num2 || 2;
  return num1 * num3;
}
console.log(multiply(10));

출력:

위의 예에서는 두 개의 매개 변수가 있는 multiply라는 함수를 선언했으며 num1 및 num2가 두 번 호출됩니다. 여기서는 두 함수를 별도로 호출해야 합니다.

첫 번째 호출에서는 두 개의 매개변수를 전달하고 출력을 200으로 표시한 반면 두 번째 호출에서는 매개변수 하나만 전달하고 결과를 20으로 표시했습니다. 두 번째 호출에서는 num2가 정의되지 않았으므로 대신 2가 할당됩니다.

정의되지 않은 속성 방법에서와 같이 마지막 인수만 선택적으로 만들 수 있으며 매개변수의 첫 번째, 중간 또는 조합을 선택적으로 만들 수 없습니다.

결론

선택적 function 매개 변수는 JavaScript에서 좋은 기능으로 식별할 수 있습니다. 선택적 매개변수를 사용하는 경우에도 코드를 단순화하는 데 가장 효과적입니다. 자주 사용되지 않는 기능입니다.

일부 매개변수에 대해 동일한 값을 사용하여 함수를 자주 호출하려는 경우 해당 매개변수를 선택사항으로 지정하여 반복을 피할 수 있습니다. 이를 위해 적합성에 따라 위의 방법을 사용할 수 있습니다.

JavaScript 선택적 함수 매개변수

정의되지 않은 속성 사용

인수 변수 사용

논리 OR(||) 연산자 사용

결론

관련 문장 - JavaScript Function

논리 `OR`(`||`) 연산자 사용