発熱するマイナー魂

隠れた名作の発掘が生きがい。サブカル作品の感想とIT技術メモ中心のブログです。

JavaScriptの関数は3つの方法で定義できるらしい


スポンサードリンク

JavaScriptの関数は大きく分けて3つの方法で定義できるらしいです。

(1) function命令で定義
(2) Functionのコンストラクタを利用して定義
(3) 関数リテラル表現で定義

これらの方法で関数を定義して呼び出しするサンプルコードを書きました。

<html>
  <head><title>関数定義サンプル</title></head>
  <body>
    <script type="text/javascript">
    <!--
      // (1) function命令で定義
      function increment1(value) {
        return ++value;
      }
      document.writeln('10 + 1 = ' + increment1(10));  // 10 + 1 = 11
     
      // (2) Functionのコンストラクタを利用して定義
      var increment2 = new Function('value', 'return ++value');
      document.writeln('20 + 1 = ' + increment2(20));  // 20 + 1 = 21
     
      // (3) 関数リテラル表現で定義
      var increment3 = function(value) {
        return ++value;
      };
      document.writeln('30 + 1 = ' + increment3(30));  // 30 + 1 = 31
    //-->
    </script>
  </body>
</html>


(1) function命令で定義
CやJavaに触ったことがあるのであれば、おそらくは直感的な書き方です。静的な宣言なので、関数の呼び出し処理の後に定義しても動作します。


(2) Functionのコンストラクタを利用して定義
JavaScriptの環境では「組み込みオブジェクト」と呼ばれる基本機能(ArrayやString)を備えたオブジェクトが利用できます。Functionオブジェクトもその一種であり、関数を操作する手順を提供しています。先のfunction命令はFuncionオブジェクトの実態でもあります。

Functionのコンストラクタを利用すると、引数や関数を文字列で定義できるということが魅力のようです。例えば(2)は下記のような書き方もできます。

var param = 'value';
var increment = 'return ++value';
var increment2 = new Function (param, increment);


(3) 関数リテラル表現で定義
JavaScriptでは関数はデータ型の一種、ということで名前の無い関数を定義し、それを変数に代入して使うこともできます。このように定義された関数は実行時に評価されるので、関数の呼び出し処理の後に定義すると実行時にエラーとなります。