Time delay in Javascript

Question

Function PS.Tick() is called every 100 milliseconds and its job is to call AI function of NPCs so they can move:

PS.Tick = function ()
{
"use strict";
for (NPCid = 0; NPCid < NPCnumber; NPCid++)
{
    NPCAI(NPCid);
};
};

But I want the NPCs to not move simultaneously every 100 millisecond, but do it at their own frequency, so I tried this code:

PS.Tick = function ()
{
"use strict";
for (NPCid = 0; NPCid < NPCnumber; NPCid++)
{
    var timeout = 0;
    timeout = PS.Random (1000);
    setTimeout("NPCAI(NPCid)",timeout);
};
};

Now, they don't move at all. Why? How do I make them move at different time intervals?

I want to point out that this could have very strange timing. Basically, every 100 milliseconds, you are deciding how far into the future you want to call NPCAI(NPCid). What if, on the first time around for NPCid=0, the variable timeout is 1000. Then, the next time PS.Tick is called, timeout is 0. The second NPCAI(NPCid) would be called before the first. I'm not sure if this is an issue for your program, but I wanted to call it out... — lbstr
– lbstr, Commented Jul 9, 2012 at 15:52
If you desired affect is to have each NPC move "at their own frequency" like you say, then you will need a different approach. If you want them to move at random intervals, this should work fine. — lbstr
– lbstr, Commented Jul 9, 2012 at 15:54
lbstr - yes, they move quite odd, for a moment they are slugish and then they burst in 3 or 4 very fast moves and are slugish again. How would I fix that? — DerpTomi
– DerpTomi, Commented Jul 10, 2012 at 11:55
well, if you reduce your random count, there will be a smaller range of intervals. Right now, it could move anywhere between 100 and 1100 milliseconds. If you reduce 1000 to 100, for example, it could move anywhere between 100 and 200 milliseconds. It will still be random, but less jumpy. — lbstr
– lbstr, Commented Jul 10, 2012 at 15:34

Joe · Accepted Answer · 2012-07-09 15:46:40Z

2

make that

for (NPCid = 0; NPCid < NPCnumber; NPCid++) {
    var timeout = 0;
    timeout = PS.Random (1000);
    (function (id) {
        setTimeout(function(){NPCAI(id)},timeout);
    })(NPCid); };

That extra function is needed to capture the ID in a closure. Without it, only the last ID of the loop will be passed in each instance.

answered Jul 9, 2012 at 15:46

Joe

48k37 gold badges166 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

DerpTomi Over a year ago

I'm sorry I can't really understand your answer.

apsillers Over a year ago

@user1510009 See stackoverflow.com/questions/750486/… for an introduction to closures and why they apply in this case (namely, function-creation inside a loop).

T.J. Crowder · Accepted Answer · 2012-07-09 15:50:38Z

Now, they don't move at all. Why?

A couple of possible reasons:

If NPCid isn't declared anywhere: Your code is throwing a ReferenceError.
If NPCid is declared somewhere but it's not a global: When you pass a string into setTimeout, it doesn't get evaluated in the current execution context and doesn't have access to NPCid. In general, don't pass strings into setTimeout.
If NPCid is a global: When the delayed code is executed, they'll all see the same value for NPCid, which is its value at the end of the loop.

Instead: If you're doing this on NodeJS (I'm just inferring this from what you're doing), you can do this):

PS.Tick = function ()
{
    "use strict";

    // (I'm assuming NPCid is defined somewhere; if not, add `var NPCid;` here)

    for (NPCid = 0; NPCid < NPCnumber; NPCid++)
    {
        var timeout = 0;
        timeout = PS.Random (1000);
        setTimeout(NPCAI, timeout, NPCid); // NodeJS (and Firefox) ONLY!!
    }
};

That works because on NodeJS (and Firefox), setTimeout can accept arguments to pass to the function to call.

If you're not using NodeJS or Firefox, but you do have access to ES5's Function#bind, you can do this:

PS.Tick = function ()
{
    "use strict";

    // (I'm assuming NPCid is defined somewhere; if not, add `var NPCid;` here)

    for (NPCid = 0; NPCid < NPCnumber; NPCid++)
    {
        var timeout = 0;
        timeout = PS.Random (1000);
        setTimeout(NPCAI.bind(undefined, NPCid), timeout);
    }
};

Function#bind returns a function that, when called, will call the original function with a specific this value and the arguments you give it.

If not, you can write your own bind, or do it like this:

PS.Tick = function ()
{
    "use strict";

    // (I'm assuming NPCid is defined somewhere; if not, add `var NPCid;` here)

    for (NPCid = 0; NPCid < NPCnumber; NPCid++)
    {
        var timeout = 0;
        timeout = PS.Random (1000);
        setTimeout(makeHandler(NPCid), timeout);
    }

    function makeHandler(id) {
        return function() {
            NPCAI(id);
        };
    }
};

That works by creating a function that, when called, turns around and calls NPCAI with the value we pass into it.

@user1510009: Great! You're welcome. Question: Are you using NodeJS?

Dpolehonski · Accepted Answer · 2012-07-09 15:48:49Z

-1

Your setTimeout doesn't call any functions,

try this:

setTimeout(function(){ NPCAI(NPCid); }, timeout);

or better use set interval for each NPC independently, however using lots of timeouts and intervals is highly inefficient so be aware and ready for lag.

answered Jul 9, 2012 at 15:48

Dpolehonski

9586 silver badges11 bronze badges

2 Comments

apsillers Over a year ago

You need a closure around the function; otherwise, the NPCAI function will be called repeatedly with the last NPCid value. (See @Joe's answer.)

Dpolehonski Over a year ago

I agree, I'd vote for joes awnser above mine but stackoverflow thinks i'm too new to do it.

Collectives™ on Stack Overflow

Time delay in Javascript

3 Answers 3

2 Comments

2 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related