Question

124

setTimeout and this in JavaScript

rated 0 times [ 131] [ 7] / answers: 1 / hits: 32735 / 16 Years ago, thu, february 26, 2009, 12:00:00

I have a method that uses the setTimeout function and makes a call to another method. On initial load method 2 works fine. However, after the timeout, I get an error that says method2 is undefined. What am I doing wrong here?

ex:

test.prototype.method = function()

{

    //method2 returns image based on the id passed

    this.method2('useSomeElement').src = http://www.some.url;

    timeDelay = window.setTimeout(this.method, 5000);

};



test.prototype.method2 = function(name) {

    for (var i = 0; i < document.images.length; i++) {

        if (document.images[i].id.indexOf(name) > 1) {

            return document.images[i];

        }

    }

};

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

grayson

Add To Favorites

Follow

Total Points: 36

Total Questions: 113

Total Answers: 95

Location: Tonga

Member since Fri, Aug 21, 2020

4 Years ago

grayson questions

1 js error : 'createObjectURL' on 'URL': Overload resolution failed.

Sat, Mar 26, 22, 00:00, 2 Years ago

1 Play/Pause video onScroll in Reactjs

Mon, Sep 14, 20, 00:00, 4 Years ago

1 React Hook useContext is called in function age which is neither a React function component or a custom React Hook function

Mon, Feb 3, 20, 00:00, 4 Years ago

1 Adding Square Brackets to JSON-Object

Fri, Feb 22, 19, 00:00, 5 Years ago

1 React: set State or set Prop without a Rerender

Sat, Feb 9, 19, 00:00, 5 Years ago

View All

answered 16 Years ago jamir · Accepted Answer

The issue is that setTimeout() causes javascript to use the global scope. Essentially, you're calling the method() class, but not from this. Instead you're just telling setTimeout to use the function method, with no particular scope.

To fix this you can wrap the function call in another function call that references the correct variables. It will look something like this:

test.protoype.method = function()

{

    var that = this;



    //method2 returns image based on the id passed

    this.method2('useSomeElement').src = http://www.some.url;



    var callMethod = function()

    {

        that.method();

    }



    timeDelay = window.setTimeout(callMethod, 5000);

};

that can be this because callMethod() is within method's scope.

This problem becomes more complex when you need to pass parameters to the setTimeout method, as IE doesn't support more than two parameters to setTimeout. In that case you'll need to read up on closures.

Also, as a sidenote, you're setting yourself up for an infinite loop, since method() always calls method().