Question

I have a variable created with setInterval called cycle1. It is created with setInterval inside of a prototyped function to an object called eGi, which is the same as $_. After creating it, it still fires, but is inaccessible to the rest of the script and the console. When I try to clear this interval from another prototyped function, nothing happens.

eGi.prototype.startGame = function() {
    //other code...
    if (somethingOrOther) { 
        var somethingElse = confirm("start interval?");
        if (somethingElse) {
            this.cycle1 = setInterval($_.cycle,toMS(INTERVAL_SECONDS));
        }
    } else {
        this.cycle1 = setInterval($_.cycle,toMS(INTERVAL_SECONDS));
    }
};

then when i try and stop it in another function

eGi.prototype.gameOver = function() {
    clearInterval(this.cycle1);
    //other code...
    if (restart) {
        $_.startGame();
    } else {
        $_.mainMenu();
    }
};

It never gets cleared, and seems to be created again in the calling of $_.startGame. I can’t even access it from the Chrome console using $_.cycle1 or the eGi instance variable, egi.cycle1. The strange thing is, this works for accessing any other variable that belongs to my eGi object:

var eGi = function(console,cDom,ctxt,game,devMode) {
    $_ = this;
    this.game = game;
    this.cDom = cDom; //specifically, these objects control the canvas' DOM
    this.ctxt = ctxt; //and the CanvasRenderingContext2D
}
eGi.prototype.mainMenu = function() {
    this.ctxt.fillText("Hello",250,250); //this works just fine
    //etc
};

Why isn’t it being cleared?

Full code/game here.

Answer 1

It’s a nice game…

The problem is you are referring to “this” inside gameover which doesn’t contain reference to cycle1 (undefined).

Instead you have to store “cycle1” as part of an object which can be referenced from your other function (in this case gameover)

Making variables as global is not a good thing. Instead you can store the “cycle1” as part of eGi or any such namespace or object.

Refer here (working code): JSFiddle implementation

Javascript code (start and stop are input buttons)

var eGi = {};

$('#start').click(function start() {
var somethingElse = confirm("start interval?");
if (somethingElse) {
    eGi.cycle1 = setInterval(function(){
        console.log('Running...');
    },1000);
}
});

$('#stop').click(function stop(){
      clearInterval(eGi.cycle1);
    });
​