JavaScript でのメソッド呼び出しの詳細な紹介

この記事では、JavaScript におけるメソッド呼び出しについて詳しく紹介します。JavaScript では、関数がオブジェクトに属している場合、そのオブジェクトを介して関数にアクセスすることを「メソッド呼び出し」と呼びます。 。

JavaScriptでは、関数がオブジェクトに属している場合、そのオブジェクトを介して関数にアクセスする行為を「メソッド呼び出し」と呼びます。通常の関数呼び出しとは異なり、メソッド呼び出しを行うと、関数内の this 参照が変更されます。これは、関数の呼び出しに使用されるオブジェクトを参照します (オブジェクトはメソッド呼び出しの呼び出しコンテキストになります):

var x = 99;
var sample = {
  x:1,
  act:function(a){
    this.x = a*a;//assign value to sample's x, not global object's x.
  }
}
sample.act(6);
console.log(sample.x);//36
console.log(x);//9

オブジェクトのプロパティにアクセスするのと同じように、ドット演算子を使用するだけでなく、JavaScript はブラケット演算子を使用してメソッド呼び出しを行うこともできます。

//other ways to invoke method
sample["act"](7);
console.log(sample.x);//4

JavaScript の関数の場合、より興味深い動作です。それは、関数 (クロージャ) を関数に埋め込むことができるということです。メソッド呼び出しを行うとき、メソッド関数に埋め込み関数がある場合、埋め込み関数内のコードは外部変数値にアクセスできます:

//nested function can access variable outside of it.
var y = 88;
var sample2 = {
  y:1,
  act2:function(a){
    this.y = inner();
    function inner(){
      return a*a;
    }
  }
}
sample2.act2(8);
console.log(sample2.y);//64
console.log(y);//88

ただし、直感に反して、埋め込み関数はコード内のコードはこれを外部から継承できません。つまり、埋め込み関数では、メソッドを呼び出すオブジェクトではなく、グローバル オブジェクトを参照します。

//nested function does not inherit "this". The "this" in nested function is global object
var sample3 = {
  act3:function(){
    inner();
    function inner(){
      console.log(this);//window object
    }
  }
}
sample3.act3();

本当に必要な場合関数を埋め込む メソッドを呼び出すオブジェクトにアクセスするには、この値を外部関数の変数に保存します。

//pass "this" to nested function
var sample4 = {
  act4:function(){
    var self = this;
    inner();
    function inner(){
        console.log(self);//Object {act4=function()}
    }
  }
}
sample4.act4();

上記はこの章の全内容です。さらに関連するチュートリアルについては、こちらをご覧ください。 JavaScript ビデオ チュートリアル !