Question

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

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

我创建了一个带有示例的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();
});

我按顺序执行代码执行警报。所以：

是准备好文件的开始。
是Abc实例的创建。
是Xyz实例的创建，其中Abc实例的onEvent函数被分配给Xyz的listenFn。
位于调用Zyz上的执行点之后，后者又调用Xyz的onEvent并显示this.myVar的值。

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

干杯。

Answer 1

修改

以下是您的问题的答案

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

像这样使用绑定会将a.onEvent中的this值预先设置为a。请注意，IE8不支持bind，但您可以轻松添加垫片from here。

另一种方法是说：

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

如果不深入研究代码，我只会这样说：在JavaScript中找出this的价值非常容易;这一切都取决于函数被称为的方式。

如果您有x.foo()，则无论什么*，this将等于foo内的x。

如果你有foo()，那么，无论什么*，this将成为全局对象，或者在foo内部以严格模式未定义。

如果您说new foo()，那么this将是一个新对象，其原型将设置为foo.prototype

如果你说foo.call(a)，那么this将在foo中a *，但这并不适用于此。

*唯一的例外是，如果您已将foo声明为

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

然后你为foo的所有调用预先绑定this为obj，并将覆盖上述规则。

Javascript原型，通过不同的函数调用时使用它

1 个答案: