JavaScript-함수

함수는 프로그램의 어느 곳에서나 호출 할 수있는 재사용 가능한 코드 그룹입니다. 이렇게하면 동일한 코드를 반복해서 작성할 필요가 없습니다. 프로그래머가 모듈 식 코드를 작성하는 데 도움이됩니다. 함수를 사용하면 프로그래머가 큰 프로그램을 여러 개의 작고 관리 가능한 함수로 나눌 수 있습니다.

다른 고급 프로그래밍 언어와 마찬가지로 JavaScript는 함수를 사용하여 모듈 식 코드를 작성하는 데 필요한 모든 기능을 지원합니다. 다음과 같은 기능을 보았을 것입니다.alert() 과 write()이전 장에서. 우리는 이러한 기능을 몇 번이고 사용했지만 핵심 JavaScript로 한 번만 작성되었습니다.

JavaScript를 사용하면 자체 함수도 작성할 수 있습니다. 이 섹션에서는 JavaScript로 자신 만의 함수를 작성하는 방법을 설명합니다.

기능 정의

함수를 사용하기 전에 정의해야합니다. JavaScript에서 함수를 정의하는 가장 일반적인 방법은function 키워드, 고유 한 함수 이름, 매개 변수 목록 (비어있을 수 있음) 및 중괄호로 둘러싸인 명령문 블록이 뒤 따릅니다.

통사론

기본 구문이 여기에 표시됩니다.

<script type = "text/javascript">
   <!--
      function functionname(parameter-list) {
         statements
      }
   //-->
</script>

예

다음 예제를 시도하십시오. 매개 변수를받지 않는 sayHello라는 함수를 정의합니다.

<script type = "text/javascript">
   <!--
      function sayHello() {
         alert("Hello there");
      }
   //-->
</script>

함수 호출

나중에 스크립트의 어딘가에서 함수를 호출하려면 다음 코드에 표시된대로 해당 함수의 이름을 작성하기 만하면됩니다.

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello() {
            document.write ("Hello there!");
         }
      </script>
      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello()" value = "Say Hello">
      </form>      
      <p>Use different text in write method and then try...</p>
   </body>
</html>

산출

기능 매개 변수

지금까지 매개 변수가없는 함수를 보았습니다. 그러나 함수를 호출하는 동안 다른 매개 변수를 전달하는 기능이 있습니다. 이러한 전달 된 매개 변수는 함수 내에서 캡처 할 수 있으며 이러한 매개 변수를 통해 모든 조작을 수행 할 수 있습니다. 함수는 쉼표로 구분 된 여러 매개 변수를 사용할 수 있습니다.

예

다음 예제를 시도하십시오. 우리는 우리의sayHello여기에 기능. 이제 두 개의 매개 변수가 필요합니다.

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello(name, age) {
            document.write (name + " is " + age + " years old.");
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello('Zara', 7)" value = "Say Hello">
      </form>      
      <p>Use different parameters inside the function and then try...</p>
   </body>
</html>

산출

반환 진술

JavaScript 함수는 선택 사항을 가질 수 있습니다. return성명서. 함수에서 값을 반환하려는 경우 필요합니다. 이 문은 함수의 마지막 문이어야합니다.

예를 들어 함수에 두 개의 숫자를 전달한 다음 함수가 호출 프로그램에서 곱셈을 반환 할 것으로 예상 할 수 있습니다.

예

다음 예제를 시도하십시오. 호출 프로그램에서 결과를 반환하기 전에 두 개의 매개 변수를 취하고이를 연결하는 함수를 정의합니다.

<html>
   <head>  
      <script type = "text/javascript">
         function concatenate(first, last) {
            var full;
            full = first + last;
            return full;
         }
         function secondFunction() {
            var result;
            result = concatenate('Zara', 'Ali');
            document.write (result );
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "secondFunction()" value = "Call Function">
      </form>      
      <p>Use different parameters inside the function and then try...</p>  
  </body>
</html>

산출

JavaScript 함수에 대해 배울 것이 많지만이 튜토리얼에서 가장 중요한 개념을 다루었습니다.

자바 스크립트 중첩 함수
JavaScript 함수 () 생성자
JavaScript 함수 리터럴