Why wont this Javascript method keep calling itself?

2024/2/27 7:29:57

I have a JavaScript object with a privileged method. When this method has completed, I would like it to call itself (after a small timeout) and continue running indefinitely. Unfortunately, the method only runs twice, then it stops without any error (tested in Chrome and IE with the same results).

The code is as follows:

function Test() {// ... private variables that testMethod needs to access ...this.testMethod = function() {alert("Hello, from the method.");setTimeout(this.testMethod, 2000);};
}var myTest = new Test();
myTest.testMethod();

I would expect to get the alert every two seconds, but instead it only shows the alert twice, then stops. You can see a live example here. Any idea why this would be happening?

Answer

Because this outside the function is not the same as this inside the function. Try instead:

function Test() {// ... private variables that testMethod needs to access ...var me = this;this.testMethod = function() {alert("Hello, from the method.");setTimeout(me.testMethod, 2000);};
}
http://en.ppmy.cn/q/41423.html

Related Q&A

JavaScript closure and the this object

I thought I had a reasonable understanding of the this object in JavaScript. When dealing with objects, callbacks, and both events and handlers, I havent had a problem with it since time immemorial. No…

Using Ant Design Variables in Styled Components

I am using Ant Design in conjunction with Styled Components inside of a GatsbyJS site. I would like to be able to access the Ant Design variables (which are written in Less) within a styled component.…

Data Structure to represent a DAG in Javascript

I have a string that I need to parse into a graph (DAG) data structure using javascript. Included in the data structure are a few attributes I should store, such as the nodes id, name, and a label tha…

How to reference a key from the same object when creating it?

Say I have an object such as this:var time = {second: 1000,minute: 1000 * 60,hour : 1000 * 60 * 60,day : 1000 * 60 * 60 * 24,week : 1000 * 60 * 60 * 24 * 7 };How would I shorten it so it would refe…

How do you reduce the number of Y-axis ticks in dimple.js?

In dimple.js is there a way to, for example, reduce the number of y-axis ticks by half so that it would only show every other y tick instead of all of them?

how to open popup within popup in magnific popup plugin

can anybody tell me how to open popup within popup using magnific-popup jquery plugin (using ajax).$(.ajax-popup-link).magnificPopup({type: ajax }); <a href="path-to-file.html" class="…

Deselect all options in Multiple Select with 1 option

I currently have the following js codefunction clearMulti(option) {var i;var select = document.getElementById(option.parentNode.id);for(i=1;i<select.options.length;i++){select.options[i].selected=fa…

Angular UI Datepicker Limiting Days per month

I am using using the angular datepicker: http://angular-ui.github.io/bootstrap/#/datepickerCurrently it is hardcoded to display 42 days or 6 weeks.I would like to know how to overwrite (ie. angular dec…

Google Maps v3: need multiple draggable markers to update HTML input fields

Im working on a project using Google Maps v3 that will allow users to drag and drop randomly placed markers (quantity, coordinates, and labels generated with php).I would like the latitude and longitud…

How do I change @keyframes using JS? [duplicate]

This question already has answers here:Passing parameters to css animation(3 answers)Closed 3 years ago.Im using #progressBar{background-color: #247BA0;width: 150px;padding: 10px;border-radius: 5px;ani…