Javascript setTimeout and prototype

Question

My task is very simple I need two workers running.

var taskNum = 0;

function Task() {
  var me = this;
  this.name = '#' + ++taskNum;

  Task.prototype.run = function () {
   console.log(me.name);
   setTimeout(me.run, 1000);
  }
}

var t1 = new Task();
t1.run();
var t2 = new Task();
t2.run();

The output should be 1,2,1,2 but it is: 1 2 1 2 2 2 2 2 2

This could be solved by changing 'Task.prototype.run' to 'this.run'. But can this be fixed by not removing the prototype, because I need it in complex solution?

melpomene · Accepted Answer · 2015-08-16 11:27:17Z

5

That's because you override Task.protoype.run inside the construction function itself, and you set the new version to use the latest me variable.

A more common way to build a class is:

var taskNum = 0;

function Task() {
  this.name = '#' + ++taskNum;
}

Task.prototype.run = function () {
  console.log(this.name);
  setTimeout(Task.prototype.run.bind(this), 1000);
}

var t1 = new Task();
t1.run();
var t2 = new Task();
t2.run();

edited Aug 16, 2015 at 11:27

melpomene

86.2k8 gold badges96 silver badges155 bronze badges

answered Aug 16, 2015 at 11:22

Amit

46.5k9 gold badges84 silver badges114 bronze badges

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

6 Comments

Daniel A. White Over a year ago

don't forget to bind on run!

Amit Over a year ago

@DanielA.White - was editing while you commented :-)

dangor Over a year ago

Feel free to use setTimeout(this.run.bind(this), 1000)

Amit Over a year ago

@dangor - Thanks, I rather be explicit and uber-clear.

Manwal Over a year ago

@Amit what is bind doing here?

|

ankhzet · Accepted Answer · 2015-08-16 12:15:53Z

1

In JavaScript there is no variable scope like public,private etc . So the object of me gets overridden after executing second new Task() line That's why you are getting that output

You can confirm this by creating two object first then calling run method

var t1 = new Task();
var t2 = new Task();
t1.run();
t2.run();

Now you will get output like 2 2 2 2 2 .....

To solve this issue you can pass tha Task object as parameter in run function like this:

t1.run(t1);

And then change your prototype run function as

Task.prototype.run = function (taskObject) {
    console.log(taskObject.name);
    setTimeout(taskObject.run, 1000);
}

Not tested but most likely it will work

edited Aug 16, 2015 at 12:15

ankhzet

2,5991 gold badge27 silver badges36 bronze badges

answered Aug 16, 2015 at 11:31

ashishmaurya

1,19610 silver badges18 bronze badges

1 Comment

Amit Over a year ago

That's not a good idea at all. The purpose of an object is to have properties that can be accessed in it's own context.

Collectives™ on Stack Overflow

Javascript setTimeout and prototype

2 Answers 2

6 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related