1

我正在使用多个原型来管理一些复杂的情况，并且在使用“this”时遇到了麻烦。我不是 100% 确定如何描述，因为我不熟悉正确的术语，但我会试一试。

函数 X 有一个变量指向函数 Y 中的函数。函数 Y 中的这个方法希望访问函数 Y 范围内的变量，但是当我使用 this 时，它指的是函数 X。

我创建了一个带有示例的JSFiddle，使用原型等（因为这是我发现自己所处的场景）。但是代码很短，所以我将它包含在下面：

var Abc = function(options) {
    alert('2');
    options = options || {};
    this.myVar = options.myVar || 'Abc.myVar';
};
Abc.prototype = {
    onEvent: function() {
        alert('myVar: ' + this.myVar);
    }
};
var Xyz = function(options) {
    alert('3');
    options = options || {};
    this.listenFn = options.listenFn || function() {
        alert('x');
    };
    this.myVar = options.myVar || 'Xyz.myVar';
};
Xyz.prototype = {
    execute: function() {
        alert('4');
        this.listenFn();
    }
};
$(document).ready(function(){
    alert('1');
    var a = new Abc();
    var x = new Xyz({listenFn: a.onEvent});

    x.execute();
});

我已经按代码执行的顺序发出警报。所以：

  1. 是文件的开始准备好了。
  2. 是 Abc 实例的创建。
  3. 是 Xyz 实例的创建，其中 Abc 实例的 onEvent 函数被分配给 Xyz 的 listenFn。
  4. 在 Zyz 上执行被调用的点内，该点又调用 Xyz 的 onEvent 并显示 this.myVar 的值。

我遇到的问题是，当在 Abc 的方法中时，“this”指的是 Xyz 实例。我需要能够为 Xyz 的实例设置/获取 myVar 的值。我怀疑我可以通过创建一个传递给新 Xyz 语句的函数来做一些混乱的事情，从而将 Abc 的实例传递回自身，但不幸的是，这对于我正在使用的东西是不可能的（也不是很优雅）。

干杯。

4

1 回答 1

3

编辑

这是您问题的答案

$(document).ready(function(){
    alert('1');
    var a = new Abc();
    var x = new Xyz({listenFn: a.onEvent.bind(a) }); // <------- bind

    x.execute();
});

this像这样使用 bind 会将a.onEvent 内部的值预先设置为a。请注意，IE8 不支持，但您可以从此处bind轻松添加 shim 。

另一种方法是说：

$(document).ready(function(){
    alert('1');
    var a = new Abc();
    var x = new Xyz({listenFn: function() { a.onEvent() }); 

    x.execute();
});

无需深入研究您的代码，我只想说：找出thisJavaScript 中的值很容易；这完全取决于调用函数的方式。

  • 如果你有x.foo()，那么，无论如何*，this都将等于xfoo 的内部。

  • 如果你有foo()，那么，无论如何*，this都将是全局对象，或者在 foo 内部的严格模式下未定义。

  • 如果你说new foo()thenthis将是一个新对象，其原型将设置为foo.prototype

  • 如果你说foo.call(a)， foo 里面this会有a* ，但这并不适用于此。

*一个例外是，如果您将 foo 声明为

var foo = function() { }.bind(obj);

那么你已经预先绑定this了objfoo 的所有调用，并且会覆盖上面的规则。

于 2012-12-08T06:16:14.993 回答