我在构建Javascript对象以及使用setTimeout在该对象中调用方法时遇到问题。我尝试了各种解决方法,但是始终在循环的第二部分,作用域变成了窗口对象,而不是我的自定义对象。警告:我对javascript很陌生。
我的代码:
$(function() {
slide1 = Object.create(slideItem);
slide1.setDivs($('#SpotSlideArea'));
slide1.loc = 'getSpot';
slide2 = Object.create(slideItem);
slide2.setDivs($('#ProgSlideArea'));
slide2.loc = 'getProg';
slide2.slide = 1;
setTimeout('triggerSlide(slide1)', slide1.wait);
setTimeout('triggerSlide(slide2)', slide2.wait);
});
function triggerSlide(slideObject) {
slideObject.changeSlide(slideObject);
}
var slideItem = {
div1: null,
div2: null,
slide: 0,
wait: 15000,
time: 1500,
loc: null,
changeSlide: function(self) {
this.slide ? curDiv = this.div1:curDiv = this.div2;
$(curDiv).load(location.pathname + "/" + this.loc, this.slideGo(self));
},
setDivs: function(div) {
var subDivs = $(div).children();
this.div1 = subDivs[0];
this.div2 = subDivs[1];
},
slideGo: function(self) {
if(this.slide) {
$(this.div2).animate({
marginLeft: "-300px"
}, this.time);
$(this.div1).animate({
marginLeft: "0"
}, this.time);
setTimeout('triggerSlide(self)', this.wait);
} else {
$(this.div1).animate({
marginLeft: "300px"
}, this.time);
$(this.div2).animate({
marginLeft: "0"
}, this.time);
setTimeout('triggerSlide(self)', this.wait);
}
this.slide ? this.slide=0:this.slide=1;
}
}
我最近的尝试是构建辅助函数triggerSlide,以便我可以尝试通过我的方法将引用传递给对象,但即使这样似乎也不起作用。
我可以使用setInterval,但是它可以工作:
最佳答案
对于Java语言(和Stackoverflow)入门的Java语言程序员来说,这是必读的。
与Java不同,无论如何声明函数,函数都没有对任何对象的固有“绑定(bind)”。对象上下文的绑定(bind)仅在函数调用时发生。因此,当您将对函数的引用传递给诸如“setTimeout”之类的东西时,从某个对象获得该函数根本不重要。它只是一个函数,“setTimeout”将使用默认上下文window
对象来调用它。
有很多方法可以解决此问题(我不会将其称为“问题”;这是语言的事实,也是一种非常强大的功能)。如果您使用某种类型的框架,则会更容易。
另一件事:您将超时和间隔处理程序绑定(bind)为包含代码的字符串。这是一个非常丑陋的做法,因此您应该习惯于形成函数表达式-即,其值为函数的表达式。
例如,对于您的“slideItem”处理程序,您可以这样做:
// ...
setTimeout(function() { slideItem.changeSlide(); }, 5000);
这样,超时机制调用的函数将始终以“slideItem”对象作为上下文来调用“changeSlide”。您不需要“changeSlide”中的“self”参数,因为“this”将指向正确的对象。
[edit]我注意到您实际上在使用jQuery,这是一件好事。