JavaScriptの関数オブジェクトを完璧に理解する

白石俊平(あゆた)
2008-04-11 16:00:00
  • このエントリーをはてなブックマークに追加

前回までのおさらいと今回のあらすじ

 前回は、thisキーワードについて深く解説しました。関数内で使用する「this」は、状況に応じて様々に変化する可能性がある、というお話でしたね。

 これでやっと、JavaScriptの関数が持つ様々な機能を説明するための前提知識が整いました!

 JavaScriptの関数については、当連載でも一度取り上げています。JavaScriptの関数は、単なる手続きの単位ではなくオブジェクトの一種なのだ、と言うことを取り上げたトピックでした。

 そう、JavaScript関数の実体は、Functionクラスのオブジェクトです。Functionクラスには、関数を操るための様々なメソッドやプロパティが存在します。今回は、それらを網羅的に解説するとともに、関数内でのみ使用可能な「arguments」オブジェクトについてもお話ししたいと思います。

Functionクラスのメンバ

 先ほども申し上げた通り、JavaScriptにおける関数とは、Functionクラスと言う組み込みクラスのオブジェクトです。

 Functionクラスが持つメンバには以下のようなものがあります。

call()/apply()

 Functionクラスには、call()とapply()と言うメソッドがあります。この二つのメソッドは、どちらも「関数呼び出し」を目的としており、引数の指定方法に違いがあります。

// apply()メソッドの定義
Function.prototype.apply (thisArg, argArray)

// call()メソッドの定義
Function.prototype.call (thisArg [ , arg1 [ , arg2, … ] ] )

 どちらも、第一引数は「thisArg」となっています。これは、関数内で使用するthisキーワードが指すオブジェクトです。もしthisArgにnullやundefinedを指定すると、関数内で使用するthisはグローバルオブジェクト(ブラウザ環境であればwindowオブジェクト)を指すことになります。

 使用例を次に示します。まず、配列arrに要素を3つ追加し、表示する以下のようなプログラムがあったとします。

var arr = ["h", "e"];
// 配列に["l", "l", "o"]を追加
arr.push("l", "l", "o");
alert(arr.join()); // 結果は"h,e,l,l,o"

 配列のpush()メソッドを呼び出して要素を追加している部分を、call()やapply()を使って書き直すと、以下のようになります。

// apply()を使う
Array.prototype.push.apply(arr, ["l", "l", "o"]);

// call()を使う
Array.prototype.push.call(arr, "l", "l", "o");
  • 新着記事
  • 特集
  • ブログ