Assigning Function Invocations to Variables
var a = setInterval(function(){console.log('Did I start yet?'), 2000);
What happens if we open our Chrome console and paste this in?
It's a bit deceiving, but we're assigning variable a
to a function invocation. It's similar to running the following code:
var b = function(){console.log('Did I log myself?')};
var c = b();
Notice how, right after we declare var c = b()
, we invoke variable b
.
Despite us immediately invoking setInterval, we're able to stop it whenever we like with clearInterval:
var a = setInterval(function(){console.log('Did I start yet?'), 2000);
clearInterval(a);
Excellent! We can control when our setInterval ends. But we don't have control over where it begins. So how do we control this? Let's look at a scenario where we're using objects and methods:
var obj = {
aKey: setInterval(() => console.log('hi'), 2000)
}
Running this code would also invoke setInterval. So how do we control when our setInterval begins?
var obj = {
aKey: function() {
return obj.interval = setInterval(() => console.log('hi'), 2000);
}
}
// START INTERVAL: Begins setInterval with its ID set to obj.interval
obj.aKey();
// STOP INTERVAL: Clears the interval we set
clearInterval(obj.interval)
Full setInterval Start/Stop Control Achieved!
There you have it. I hope this brief write-up was helpful!