setInterval does not work with method of my object why ?

  • (2 Pages)
  • +
  • 1
  • 2

22 Replies - 2733 Views - Last Post: 13 October 2011 - 12:56 PM

#1 xmerou  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 47
  • Joined: 20-January 11

setInterval does not work with method of my object why ?

Posted 08 October 2011 - 04:30 PM

hi i m in trouble i made some piece of code , i've used setInterval() like this way

function Engine(x,y,t,obj)
{
    this.x=x; 
    this.y=y; 
    this.t=t; 
    this.targetObj=obj; 
}
Engine.prototype.interval=function() 
{ 
    setInterval(Engine.move,1000);   
 
/* here is the problem it doesn't call it although if i make 
setInterval("Engine.move()",1000);
                                                                                 but if i call it with separate function like that 
setInterval("move()",1000); it works  why ??  */
};
Engine.prototype.move=function()
{ 
    /* some code here to handle obj */  
};

This post has been edited by Dormilich: 09 October 2011 - 12:37 AM
Reason for edit:: please use [code] /* your code source here */ [/code] tags when posting code


Is This A Good Question/Topic? 0
  • +

Replies To: setInterval does not work with method of my object why ?

#2 codeprada  Icon User is offline

  • Changed Man With Different Priorities
  • member icon

Reputation: 948
  • View blog
  • Posts: 2,357
  • Joined: 15-February 11

Re: setInterval does not work with method of my object why ?

Posted 08 October 2011 - 08:30 PM

Please use code tags when you're posting code.

Engine isn't a literal object. You need to use this.move instead. this would refer to instance of Engine.
Was This Post Helpful? 0
  • +
  • -

#3 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 12:40 AM

another possibility were to use setInterval(Engine.prototype.move, 1000);.

though bear in mind that this inside move() will point to window.
Was This Post Helpful? 0
  • +
  • -

#4 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5901
  • View blog
  • Posts: 12,806
  • Joined: 16-October 07

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 02:40 AM

Engine is the function you use to define an object. Engine doesn't have a property move.

A more logical way would be:
Engine.prototype.interval=function() { 
   var self = this; // make sure we have an explict handle on this object
   setInterval(self.move,1000);   
}


This post has been edited by baavgai: 09 October 2011 - 02:42 AM

Was This Post Helpful? 0
  • +
  • -

#5 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 02:54 AM

I donít think you need to rename this in that case. thereís no closure involved here.
Was This Post Helpful? 0
  • +
  • -

#6 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5901
  • View blog
  • Posts: 12,806
  • Joined: 16-October 07

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 03:39 AM

View PostDormilich, on 09 October 2011 - 03:40 AM, said:

though bear in mind that this inside move() will point to window.


I've had setInterval do odd things in the past. Perhaps I don't need it... perhaps I do. It could be implication specific, I don't know. I do know that being explicit ensures that the this I get is the one I intended to get. It doesn't hurt if I'm being redundant, so, there it is.
Was This Post Helpful? 0
  • +
  • -

#7 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 04:36 AM

the problem is to remember where the execution scope changes. but thatís part of the problem that most JS coders donít know/understand that a function is a regular object. for me this became clear when I tried to understand call()/apply().
Was This Post Helpful? 0
  • +
  • -

#8 xmerou  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 47
  • Joined: 20-January 11

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 12:44 PM

View Postbaavgai, on 09 October 2011 - 02:40 AM, said:

A more logical way is that is if i refer with Engine i don't need to make instance like u did
Engine.prototype.interval=function() { 
   var self = this; // make sure we have an explict handle on this object
   setInterval(self.move,1000);   
}


Was This Post Helpful? 0
  • +
  • -

#9 xmerou  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 47
  • Joined: 20-January 11

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 12:53 PM

View PostDormilich, on 09 October 2011 - 12:40 AM, said:

another possibility were to use setInterval(Engine.prototype.move, 1000);.

though bear in mind that this inside move() will point to window.

but the backward of this implementation is that
if i make two instance
var GamerA= new Engine(10,10,5,"playerA");
var GamerB= new Engine(20,20,5,"playerB");

/* here we are if i call */
GamerA.interval();
/* u see the GamerB object moving cuz he's the last instance  so crazy */
/* it would be normal result if i've used JSON notation */ 




This post has been edited by xmerou: 09 October 2011 - 12:59 PM

Was This Post Helpful? 0
  • +
  • -

#10 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5901
  • View blog
  • Posts: 12,806
  • Joined: 16-October 07

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 02:02 PM

Yeah, setInterval has strange scoping.

First test:
<html> 
<head>
	<title>Move Thing</title>
	<script type="application/javascript">
		function addStatus(html) { document.getElementById("status").innerHTML += html; }

		function Widget(name){
			this.name=name; 
			this.count = 0;
		}
		Widget.prototype.toString = function() { return this.name + ' ' + this.count; }
		Widget.prototype.interval = function() { setInterval(this.move,1000); }
		Widget.prototype.move = function() { 
			this.count++;
			addStatus(this + '<br/>');
		}
	</script>
</head>
<body>
	<h1>Interval Test</h1>
	<div id="status"></div>
	<script type="application/javascript">
		new Widget("Foo").interval();
		new Widget("Bar").interval();
	</script>
</body>
</html>



Result:
Interval Test
[object Window]
[object Window]
[object Window]
...



Clearly, we ain't calling what we think we're calling. Changed to:
Widget.prototype.interval = function() {
	var self = this;
	setInterval(self.move,1000);
}



Same result! I mentioned the scoping on this function causes hair loss? Time for the big guns:
Widget.prototype.interval = function() {
	var self = this;
	setInterval(function() { self.move(); },1000);
}



Result:
Interval Test
Foo 1
Bar 1
Foo 2
Bar 2
...



Hope this helps.
Was This Post Helpful? 0
  • +
  • -

#11 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: setInterval does not work with method of my object why ?

Posted 09 October 2011 - 02:58 PM

View Postbaavgai, on 09 October 2011 - 11:02 PM, said:

Yeah, setInterval has strange scoping.

"strange", but that is how window.setInterval() is supposed to work, much like window.setTimeout() and Element.addEventListener()

modern browsers can also use
setInterval(this.move.bind(this), 1000);

for building the Closure
Was This Post Helpful? 0
  • +
  • -

#12 xmerou  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 47
  • Joined: 20-January 11

Re: setInterval does not work with method of my object why ?

Posted 10 October 2011 - 12:38 PM

it seem that is no sollution
i think i gonna take a look at some books to understand wat exactly happens @@
Was This Post Helpful? 0
  • +
  • -

#13 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3572
  • View blog
  • Posts: 10,414
  • Joined: 08-June 10

Re: setInterval does not work with method of my object why ?

Posted 10 October 2011 - 12:43 PM

read about Scope, that helped me a lot.
Was This Post Helpful? 0
  • +
  • -

#14 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5901
  • View blog
  • Posts: 12,806
  • Joined: 16-October 07

Re: setInterval does not work with method of my object why ?

Posted 10 October 2011 - 12:43 PM

???

The code I offered worked. The two objects exist in separate state and do what they're supposed to do when called. If you followed that model and it's not working, then it's probably not the setInterval to blame.

If you could actually post the entire code. Or working ( or not working, as is the case ) sample, then maybe people could help you get it working.
Was This Post Helpful? 0
  • +
  • -

#15 xmerou  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 47
  • Joined: 20-January 11

Re: setInterval does not work with method of my object why ?

Posted 10 October 2011 - 01:06 PM

ok this all code i made right now

var Ev={
event:function(ev,el,ac)
	{
		try{
		var onEv="on"+ev;
		if(el.addEventListener) el.addEventListener(ev,ac,false);
		else if(el.attachEvent) el.attachEvent(onEv,ac);
		else el.onEv=ac();
		}catch(x){alert(x.message);}
	},
arg:function(x){ return x.srcElement?x.srcElement:x.target;},
x:function(x){return x.clientX?x.clientX:x.pageX;},
y:function(y){return y.clientX?y.clientY:y.pageY;}
/*end Ev*/};
/*---------------------------------------------------------------------*/
/* element Finder easy to handle */
var At={
id:function(id){return document.getElementById(id);},
nm:function(nm){return document.getElementsByName(nm)[0];},
nms:function(nms){return document.getElementsByName(nms);},
tg:function(tg){return document.getElementsByTagName(tg)[0];},
tgs:function(tgs){return document.getElementsByTagName(tgs);},
el:function(el){ return document.createElement(el);}
/*end At*/};
/***********************************************************************/

/***********************************************************************/
function Engine(XObj,T,D,yN,yX)
{ 	 Engine.space="";	Engine.sense=0;	Engine.y=0;	Engine.time=T;	Engine.dis=D;	Engine.yMin=yN;	Engine.yMax=yX;	Engine.obj=XObj;	}

Engine.prototype.interval=function(){ if(Engine.space===""){Engine.space=setInterval(function(){Engine.prototype.move()},Engine.time); }	};
Engine.prototype.move=function(){ 
		if(Engine.sense==0){	
			if(Engine.y<=Engine.yMax){Engine.y+=Engine.dis; At.id(Engine.obj).style.position="relative"; At.id(Engine.obj).style.height=Engine.y+"px"; At.id("searchNow").innerHTML=Engine.obj; At.id(Engine.obj).style.width="427px";}
			else{ Engine.sense=1; clearInterval(Engine.space); Engine.space=""; } 	
			}
		else{
			 if(Engine.y>Engine.yMin){Engine.y-=Engine.dis; At.id(Engine.obj).style.position="relative"; At.id(Engine.obj).style.height=Engine.y+"px"; At.id(Engine.obj).style.width="427px";}	
			 else{ Engine.sense=0; 	clearInterval(Engine.space); Engine.space=""; }		
			 }
	};
	
function move(){
		if(Engine.sense==0){	
			if(Engine.y<=Engine.yMax){Engine.y+=Engine.dis; At.id(Engine.obj).style.position="relative"; At.id(Engine.obj).style.height=Engine.y+"px"; At.id("searchNow").innerHTML=Engine.obj; At.id(Engine.obj).style.width="427px";}
			else{ Engine.sense=1; clearInterval(Engine.space); Engine.space=""; } 	
			}
		else{
			 if(Engine.y>Engine.yMin){Engine.y-=Engine.dis; At.id(Engine.obj).style.position="relative"; At.id(Engine.obj).style.height=Engine.y+"px"; At.id(Engine.obj).style.width="427px";}	
			 else{ Engine.sense=0; 	clearInterval(Engine.space); Engine.space=""; }		
			 }
	}

/**********************************************************************/

var InfoConso={
	con:["index.htm","index.php"],
	gamerA:"",
	gamerB:"",
	init:function(){
		Ev.event("click",At.id("leftC"),InfoConso._index);
		Ev.event("click",At.id("goNow"),InfoConso._goNow);
		Ev.event("focus",At.id("searchNow"),InfoConso._result);
		Ev.event("blur",At.id("searchNow"),InfoConso._cancel);
		/****************this two instances Engine ****************************/
		InfoConso.gamerB=new Engine("no",1,1,50,250);
		InfoConso.gamerA=new Engine("yes",1,10,50,250);
		Ev.event("mouseover",At.id("yes"),InfoConso.gamerA.interval);
		Ev.event("mouseover",At.id("no"),InfoConso.gamerB.interval);
		/********************************************************************/
														  },
	/*-------------ACTION-------------------*/
	_index:function(){
		document.location.replace(InfoConso.con[0]);	  },
	_goNow:function(){
		alert("search");
														  },
	_result:function(){
		var res=document.createElement("div");
		res.setAttribute("id","newRes");
		At.id("searchBar").appendChild(res);
														  },
	_cancel:function(){
		try{ At.id("searchBar").removeChild(At.id("newRes"));
			}catch(x){}
														  },
	
	
	
};
/******************************** load *****************/
Ev.event("load",window,InfoConso.init);
/******************************************************/




Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2