CODEWITHSUNDEEP
javascriptdojosettimeout
Steven
Steven

Reputation: 53

Call JavaScript's setTimeOut in dojo Class

I'm trying to convert my JavaScript functions to a dojo Class. I've a setTimeOut("functionName",2000) in one of my JS method. How do I call this from a method in the class decared using dojo.declare method. For example, below is my custom class.

    dojo.declare("Person",null,{
                    constructor:function(age,country,name,state){
                        this.age=age;
                        this.country=country;
                        this.name=name;
                        this.state=state;
                    },
                    moveToNewState:function(newState){
                        this.state=newState;
//I need to call "isStateChanged" method after 2000 ms. How do I do this?
                        setTimeOut("isStateChanged",2000);
                    },                  
                    isStateChanged:function(){
                        alert('state is updated');
                    }
                });
var person=new Person(12,"US","Test","TestState");
person.moveToNewState("NewState");

Please let me know how I can call isStateChanged method from moveToNewState method after 2000ms.

Upvotes: 5

Views: 10350

Answers (4)

Hanif Kukkalli
Hanif Kukkalli

Reputation: 11

You can use the dojo/_base/lang and use its hitch method like the below code:

moveToNewState:function(newState){
  // Misc logic
  this.state = newState;

  // Set up the callback
  setTimeout(lang.hitch(this, function() {
    // Call with `this`
    this.isStateChanged();
  }), 2000);
},

Upvotes: 1

T.J. Crowder
T.J. Crowder

Reputation: 1074158

What you're looking for is a way of binding the this value to the function that setTimeout will call:

moveToNewState:function(newState){
    // Remember `this` in a variable within this function call
    var context = this;

    // Misc logic
    this.state = newState;

    // Set up the callback
    setTimeout(function() {
        // Call it
        context.isStateChanged();
    }, 2000);
},

The above is using a closure to bind the context (see: Closures are not complicated), which is the usual way to do this. Dojo may offer a built-in function for generating these "bound" callbacks (Prototype and jQuery do). (Edit: It does, in his comment below peller kindly pointed out dojo.hitch.)

More about this general concept here: You must remember this

Upvotes: 9

peller
peller

Reputation: 4543

You could simply call setTimeout(this.isStateChanged, 2000) which will pass the correct function reference, not unlike the way you would call the method directly. The expression this.isStateChanged is evaluated immediately. To make the call, there's no need to wrap it in an extra function or declare local variables.

To bind the this variable to the called function, you can use dojo.hitch which will create its own closure without polluting the local variable space and potentially leaking through other references.

Upvotes: 2

Felix
Felix

Reputation: 89566

This has nothing to do with dojo, this is pure javascript. What you're looking for is:

var $this = this;
setTimeout(function() { $this.isStateChanged() }, 2000);

Check out the docs on setTimeout.

Oh, and, please don't use quotes around your function names (because that makes it a useless string that will probably get evaled and will give an error).

Upvotes: 2

Related Questions