1. ホーム
  2. javascript

[解決済み] Javascriptのthisポインタをネストされた関数内で使用する場合

2022-09-29 23:16:01

質問

ネストされた関数シナリオにおいて、"this" ポインタがどのように扱われるのかについて質問があります。

次のサンプル コードを Web ページに挿入するとします。ネストされた関数 "doSomeEffects()" を呼び出すと、エラーが発生します。 Firebugで確認したところ、そのネストした関数の中で、"this"ポインタが実際にはグローバルな"window"オブジェクトを指していることがわかりました。私は、オブジェクトの関数内でネストされた関数を宣言したので、関数との関係で "local"スコープを持つはずだと思っていたので、何かを正しく理解していないようです (つまり、最初の "if" 文でそうであるように、 "this" ポインタはオブジェクト自体を参照しているはずです)。

どんなポインタでも (ダジャレでなく) 感謝されるでしょう。

var std_obj = {
  options : { rows: 0, cols: 0 },
  activeEffect : "none",
  displayMe : function() {

    // the 'this' pointer is referring to the std_obj
    if (this.activeEffect=="fade") { }

    var doSomeEffects = function() {

      // the 'this' pointer is referring to the window obj, why?
      if (this.activeEffect=="fade") { }

    }

    doSomeEffects();   
  }
};

std_obj.displayMe();

どのように解決するのですか?

JavaScriptでは this オブジェクトは、実際には関数呼び出しをどのように行うかに基づいています。

一般に this オブジェクトを設定する方法があります。

  1. someThing.someFunction(arg1, arg2, argN)
  2. someFunction.call(someThing, arg1, arg2, argN)
  3. someFunction.apply(someThing, [arg1, arg2, argN])

上記のすべての例では this オブジェクトは someThing . 先頭の親オブジェクトを指定せずに関数を呼び出すと、通常は グローバル オブジェクトを取得します。これは、ほとんどのブラウザでは window オブジェクトを意味します。