JavaScript ファンクションの呼び出し

JavaScript関数内のコードは「何か」がそれを呼び出したときに実行されます。

JavaScript関数を呼び出す

関数が定義のとき、関数内のコードは実行されません。

関数が呼び出しのとき、関数内のコードが実行されます。

関数を呼び出すことは、通常「関数を起動する」や「関数を実行する」とも言えます。

このチュートリアルでは、私たちは「呼び出し。

関数を関数として呼び出す

インスタンス

function myFunction(a, b) {
    return a * b;
}
myFunction(10, 2);           // 返り値は20になります

実際に試してみてください

以上の関数はどのオブジェクトにも属しませんが、JavaScriptでは常にデフォルトのグローバルオブジェクトが存在します。

HTMLでは、デフォルトのグローバルオブジェクトはHTMLページ自体であり、上のすべての関数はHTMLページに「属する」です。

ブラウザで、このページオブジェクトはブラウザのウィンドウです。上の関数は自動的にウィンドウ関数になります。

myFunction() と window.myFunction() は同じ関数です：

インスタンス

function myFunction(a, b) {
    return a * b;
}
window.myFunction(10, 2);    // 20 も返却します

実際に試してみてください

これは関数を呼び出す一般的な方法ですが、良い習慣ではありません。

グローバル変数、メソッド、または関数は、グローバルオブジェクト内で名前の衝突や脆弱性を引き起こしやすくなります。

this キーワードと呼ばれます

JavaScript では、 this のものは、現在のコードを「所有」するオブジェクトを指します。

this の値は、関数内で使用される際には「所有」その関数のオブジェクトです。

注意してください this これは変数ではありません。これはキーワードです。変更することはできません。 this の値です。

グローバルオブジェクト

所有者オブジェクトなしでオブジェクトを呼び出すと、this の値がグローバルオブジェクトになります。

Web ブラウザでは、グローバルオブジェクトはブラウザオブジェクトです。

この例では、 this の値を返却します：

インスタンス

var x = myFunction();            // x は window オブジェクトになります
function myFunction() {
   return this;
}

実際に試してみてください

関数をグローバル関数として呼び出すと、 this の値がグローバルオブジェクトになります。

window オブジェクトを変数として使用すると、プログラムがクラッシュすることがあります。

関数をメソッドとして呼び出す

JavaScript では、関数をオブジェクトメソッドとして定義できます。

以下の例では、オブジェクト（myObject）を生成し、2つの属性（firstName と lastName）および1つのメソッド（fullName）を持つことを示しています：

インスタンス

var myObject = {
    firstName: "Bill",
    lastName: "Gates",
    fullName: function () {
        return this.firstName + " " + this.lastName;
    }
}
myObject.fullName();         // 返却します "Bill Gates"

実際に試してみてください

fullName メソッドは関数です。この関数はオブジェクトに属しています。myObject は関数の所有者です。

と呼ばれます this のものは、「所有」この JavaScript コードのオブジェクトです。この例では、this の値は myObject です。

テストしてみましょう！この fullName メソッドを変更して返却する this の値：

インスタンス

var myObject = {
    firstName: "Bill",
    lastName: "Gates",
    fullName: function () {
        return this;
    }
}
myObject.fullName();          // 返却します [object Object]（所有者オブジェクト）

実際に試してみてください

オブジェクトメソッドとしてファンクションを呼び出すと、 this の値はオブジェクト自体になります。

ファンクションコンストラクタを通じてファンクションを呼び出す方法

ファンクション呼び出しの前に new キーワードがあれば、これはコンストラクタ呼び出しです。

これは新しいファンクションを作成するように見えますが、JavaScript ファンクションはオブジェクトであるため、実際には新しいオブジェクトを作成しています：

インスタンス

// これはファンクションコンストラクタです：
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}
// 新しいオブジェクトが作成されました：
var x = new myFunction("Bill", "Gates");
x.firstName;                             // "Bill" が返されます"

実際に試してみてください

コンストラクタの呼び出しは新しいオブジェクトを作成します。新しいオブジェクトはそのコンストラクタから属性とメソッドを継承します。

コンストラクタ内の this キーワードには値はありません。

this の値は、ファンクションが呼び出されたときに作成される新しいオブジェクトになります。