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 関数を変更しました。現在、2つのパラメーターが必要です。

<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>

出力

returnステートメント

JavaScript関数には、オプションの return ステートメントを含めることができます。これは、関数から値を返す場合に必要です。このステートメントは、関数の最後のステートメントでなければなりません。

たとえば、関数に2つの数値を渡すと、関数が呼び出しプログラムで乗算を返すことが期待できます。

例

次の例を試してください。 2つのパラメーターを取り、それらを連結してから呼び出し側プログラムに結果を返す関数を定義します。

<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_nested_functions [JavaScriptネスト関数]
リンク：/javascript/javascript_function_constructors [JavaScript関数（）コンストラクタ]
リンク：/javascript/javascript_function_literals [JavaScript関数リテラル]

Javascript-functions

目次

JavaScript-関数

関数定義

構文

例

関数を呼び出す

出力

関数パラメーター

例

出力

returnステートメント

例

出力