gpt4 book ai didi

javascript - "this"未使用原型(prototype)引用 this-reference

转载 作者:行者123 更新时间:2023-11-30 18:18:29 25 4
gpt4 key购买 nike

<分区>

今天我在使用 Javascript 的 prototypethis 引用时遇到了一个非常奇怪的问题。

基本上,我有两个对象。一个对象使用 div 元素,并且可以在 div 上注册一个 onclick 事件。另一个对象利用此功能并使用第一个对象注册 onclick 事件。

代码如下:

我的第一个对象,负责处理 div:

DivObject = function() {};
DivObject.prototype.setClickListener = function(clickListener){
document.getElementById("myDiv").onclick = function(e){
clickListener(e);
};
};

我的第二个对象使用此功能:

MainObject = function(){
this.myString = "Teststring";
this.divObj = new DivObject();
this.divObj.setClickListener(this.handleClick);
};

MainObject.prototype.handleClick = function(e){
// do something with e
};

问题是,在 MainObject.prototype.handleClick 中,this 引用引用了 window 对象,而不是 主要对象。因此,此函数内的 console.log(this) 记录 [Object window]

You can see this behaviour on jsfiddle.

作为解决方法,我使用 setClickListener 函数,如下所示:

var thisRef = this;
this.divObj.setClickListener(function(e){
thisRef.handleClick(e);
});

现在,我的 handleClick 函数中的 this 引用引用了我的 MainObject(如我所愿)。

See this workaround on jsfiddle.

我的问题是:

为什么 this 引用一次引用 window 对象而另一次引用我的对象的 this 引用?它在某处被覆盖了吗?我一直认为在我的对象中使用 this 我可以确定它真的是我对象的 this 引用吗?我现在使用的解决方法是应该如何解决这个问题,还是有任何其他更好的方法来处理这种情况?

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com