別のオブジェクトメソッド内からオブジェクトプロパティへのアクセス

Question

私は、メソッドの束を格納し、いくつかの変数を格納するJavascriptオブジェクトを持っています。メソッドがお互いまたは変数にアクセスしようとしている通常の場合、それは正常に動作しますが、メソッドがスコープ外（たとえば、別のコールバック経由）から呼び出された場合、変数にアクセスできなくなります。ここで

例JSFiddle：

var obj = { 
 
     x: null, 
 
     func1: function() { 
 
\t  console.log('func1, x is ' + this.x); 
 
     }, 
 

 
     func2: function() { 
 
\t  console.log("func2"); 
 
     this.func1(); 
 

 
\t  var func1 = this.func1; 
 
     func3(function() { 
 
    \t  func1(); 
 
     }); 
 
     } 
 
    }; 
 

 
    function func3(callback) { 
 
\t console.log("func3"); 
 
\t return callback(); 
 
    } 
 

 
    obj.func2();

上記のコードから出力された：

func2 
func1, x is null 
func3 
func1, x is undefined 

以下 http://jsfiddle.net/3Lkuz2Lk/2/

は、問題を説明するためのサンプルコードであります

何もない私にはっきりしないのは、func1がxと呼ばれる2回目がなぜ定義されていないのか？

これを達成する必要がある場合（つまり、呼び出されたコンテキストに関係なくオブジェクト内のメソッドと変数にアクセスできるようにするにはどうすればよいですか） func3への呼び出しでfunc1参照を使用できるようにするためには、func1参照を格納する必要があるため、上記のアプローチが不正であることがわかりました。私は、よりクリーンで簡単なアプローチが望まれています。あなたはbind(this)を使用する必要が

Answer 1

var obj = { 
 
     x: null, 
 
     func1: function() { 
 
    console.log('func1, x is ' + this); 
 
     }, 
 

 
     func2: function() { 
 
    console.log("func2"); 
 
     this.func1(); 
 

 
    var func1 = this.func1; 
 
     func3(func1); 
 
     } 
 
    }; 
 

 
    function func3(callback) { 
 
    console.log("func3"); 
 
    return callback(); 
 
    } 
 

 
obj.func2();

これは最初のケースでは、このポイント次のオブジェクトにオブジェクトがあるときこのはグローバルオブジェクト/ウィンドウを参照します。私は、コードを簡略化してきました

var obj = { 
 
     x: null, 
 
     func1: function() { 
 
    console.log('func1, x is ' + this.x); 
 
     }, 
 

 
     func2: function() { 
 
    console.log("func2"); 
 
     this.func1(); 
 

 
    var func1 = this.func1.bind(this); 
 
     func3(func1); 
 
     } 
 
    }; 
 

 
    function func3(callback) { 
 
    console.log("func3"); 
 
    return callback(); 
 
    } 
 

 
obj.func2();

Answer 2

は、hereそれについての詳細をお読みください。これは、両方の場合で異なるため

var func1 = this.func1.bind(this); 

Answer 3

を行う必要があります。問題は参考になります。 func3を呼び出します。これは、スコープチェーンobjの一部ではなく、それ自身の有効範囲にあります。したがって、これはfunc3の範囲を指します。あなたがbindthisからobjにコールバックする場合、それは動作します。

var obj = { 
 
    x: null, 
 
    func1: function() { 
 
    console.log('func1, x is ' + this.x); 
 
    }, 
 

 
    func2: function() { 
 
    console.log("func2"); 
 
    this.func1(); 
 

 
    func3(this.func1.bind(this)); 
 
    } 
 
}; 
 

 
function func3(callback) { 
 
    console.log("func3"); 
 
    return callback(); 
 
} 
 

 
obj.func2();

callを使用して別の解決策は、このフィドルであるhttp://jsfiddle.net/3Lkuz2Lk/3/