JavaScript 関数は、4種類の方法で呼び出すことができます。
各メソッドは、this の初期化方法が異なります。
JavaScript における this と呼ばれるものは、現在のコードを「所有している」オブジェクトです。
関数で使用する時の this の値は、関数を「所有している」オブジェクトです。
this は、変数ではないことに注意してください。 それはキーワードで、this の値を変更できません。
JavaScript 関数内のコードは、「何か」に呼び出されたときに実行することは既に学びました。
関数が定義された時に、関数のコードが実行されるのではなく、関数が呼び出されたときに 実行されます。
一部では、"invoke a function" という代わりに、 "call a function" という用語を使用しています。
一般的には、"call upon a function"、"start a function" または "execute a function" などとも言います。
このチュートリアルでは、invoke を使います （In this tutorial, we will use invoke, because a JavaScript function can be invoked without being called）。
訳注：invoke も call も「呼び出す」と翻訳します。
In this tutorial, we will use invoke, because a JavaScript function can be invoked without being called.
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); // myFunction(10, 2) will return 20
Try it Yourself »
上の関数は、いかなるオブジェクトにも属していません。しかし、JavaScript には 常にデフォルトのグローバルオブジェクトがあります。
HTML のデフォルトのグローバルオブジェクトは HTML ページそのものなので、上の関数は HTML ページに「属します」。
ブラウザにおいて、ページ・オブジェクトはブラウザ・ウィンドウです。上の関数は、自動的に window の関数となります。
myFunction() と window.myFunction() は、同じ関数です：
function myFunction(a, b) {
return a * b;
}
window.myFunction(10, 2); // window.myFunction(10, 2) will also return 20
Try it Yourself »
これは、JavaScript 関数を呼び出すための一般的な方法ですが、コンピュータプログラミングではあまり良い習慣ではありません。
グローバル変数、メソッド、または関数は、グローバル・オブジェクトにおける名前の競合やバグを簡単に引き起こします。
関数は、所有者（owner）オブジェクトなしで呼び出された場合、this の値は グローバルオブジェクトになります。
Web ブラウザでは、ブラウザ・ウィンドウがグローバルオブジェクトになります。
この例では、this の値として window オブジェクトを返します：
function myFunction() {
return this;
}
myFunction(); // Will return the window object
Try it Yourself »
グローバル関数としての関数を呼び出した場合、this の値はグローバルオブジェクトになります。
変数として window オブジェクトを使用すると、簡単にプログラムをクラッシュさせることができます。
JavaScript では、オブジェクトのメソッドとしての関数を定義することができます。
次の例は、2つのプロパティ（firstName と lastName）、とメソッド （fullName）を持つオブジェクト（myObject）を作成します：
var myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
myObject.fullName(); // Will return "John Doe"
Try it Yourself »
fullName メソッドは関数です。関数は、オブジェクトに属します。myObject は、関数の所有者です。
this と呼ばれるものは、JavaScript コードを「所有する」オブジェクトです。 このケースでは、this の値は myObject です。
それをテストします！ this の値を返すため fullName メソッドを変更します：
var myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this;
}
}
myObject.fullName(); // Will return [object Object] (the owner object)
Try it Yourself »
関数をオブジェクトメソッドとして呼び出すと、this の値はオブジェクトそのものになります。
関数呼び出しの前に new キーワードがある場合、これはコンストラクタの呼び出しです。
新しい関数を作るように見えますが、JavaScript 関数はオブジェクトであるため、実際は新しいオブジェクトを作成します：
// This is a function constructor:
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
// This creates a new オブジェクト
var x = new myFunction("John", "Doe");
x.firstName;
// Will return "John"
Try it Yourself »
コンストラクタ呼び出しは、新しいオブジェクトを作成します。 新しいオブジェクトは、そのコンストラクタからプロパティとメソッドを継承します。
コンストラクタにおける this キーワードは、値を持ちません。
this の値は、関数が呼び出されたときに作られる新しいオブジェクトです。
JavaScript では、関数はオブジェクトです。JavaScript 関数には、プロパティとメソッドがあります。
call() と apply() は、定義済みの JavaScript 関数メソッドです。 どちらのメソッドも、関数を呼び出すために使用することができますが、最初のパラメータとして、 どちらも所有者（owner）オブジェクトを指定する必要があります。
function myFunction(a, b) {
return a * b;
}
myObject = myFunction.call(myObject, 10, 2); // Will return 20
Try it Yourself »
function myFunction(a, b) {
return a * b;
}
myArray = [10, 2];
myObject =
myFunction.apply(myObject, myArray); // Will also return 20
Try it Yourself »
どちらのメソッドも、最初の引数として所有者オブジェクトを指定する必要があります。 唯一の違いは、call() は別々に関数の引数を指定しますが、apply() は配列で引数を指定します。
JavaScript strictモードでは、引数がオブジェクトでなくても、 最初の引数は呼び出された関数の this の値になります
"non-strict" モードでは、最初の引数の値が null または undefined の場合、 グローバルオブジェクトに置き換えられます。
call() または apply() を使用すると、this の値を設定したり、 関数を既存のオブジェクトの新しいメソッドとして呼び出すことができます。