Home > Web Front-end > Front-end Q&A > How to clear all timers in javascript

How to clear all timers in javascript

青灯夜游
Release: 2023-01-07 11:47:39
Original
16733 people have browsed it

In JS, you can use the for loop and clearInterval() function to clear all timers, the How to clear all timers in javascriptntax "end=setInterval(function(){},10000);for(i=1;i

How to clear all timers in javascript

The operating environment of this tutorial: windows7 How to clear all timers in javascriptstem, javascript version 1.8.5, Dell G3 computer.

We sometimes have the need to clear all timers in the page
If we save the timer (setInterval) with a variable when we create it, then clear the timer It's very simple, just clear it (clearInterval)
For example:

let timer = setInterval(function () {
    console.log('timer');
}, 1000);

clearInterval(timer);
Copy after login

But sometimes the timer created is not saved with a variable, so we cannot clear it directly
For example:

let timer = setInterval(function () {
    console.log('timer');
}, 1000);
setInterval(function () {
    console.log('timer');
}, 1000);
clearInterval(timer);
clearInterval(/* ??? */); // 操蛋
Copy after login

We have a variable timer to save the first timer, so we can directly give timer to clearInterval It will be cleared when passed in
But we did not save the second timer. We don’t know what to pass when clearInterval, which is very messed up

So how to solve this What's the problem?
Let’s first look at the rules:

for (let i = 0; i < 10000; i++) {
    let t = setInterval(function () { }, 1000);
    console.log(t);
}
Copy after login

Running results:

How to clear all timers in javascript

Obviously eaHow to clear all timers in javascript to get:
setInterval The return value is a numerical value representing the timer, and this value is incremented from 1 according to the order in which the timer is created.
Then it is not difficult to achieve our need to clear all timers in the page.
So for example There are so many timers now:

let t = setInterval(function () { }, 1000);
let r = Math.random() * 100;
for (let i = 0; i < r; i++) {
    setInterval(function () { }, 1000);
}
Copy after login

If you want to clear them all, you must use a loop to clear the numbers corresponding to the timer from 1 to the last created using clearInterval . But now there are a bunch of timers. We don’t know how many timers there are now, so we don’t know the number corresponding to the last created timer. So first we can be more violent

for (let i = 1; i < 100000; i++) {
    clearInterval(i);
}
Copy after login

I just look for a large number such as 100000. Generally, there should not be more than 100000 timers on a page. Generally, timers are in the range of 1,100000. So this method can definitely achieve our needs.
But it’s still not good, after all, it’s a bit too violent. Then we need to find out the number n corresponding to the last timer created. We know that the number corresponding to the timer increases sequentially from 1, then we only need to create another timer and store it in a variable end Up, this number end is n 1, so we can find n, and then we can loop from 1 to n. Oh, remember to clear the n 1th timer just created, so the loop starts from 1 to end.

Then the code is as follows:

let end = setInterval(function () { }, 10000);
for (let i = 1; i <= end; i++) {
    clearInterval(i);
}
Copy after login

In this way we have perfectly realized the need to clear all timers in the page

Then let’s try the effect, taking Tencent Video as an example :

How to clear all timers in javascript

There is a carousel image on the homepage of Tencent Video. Carousel images are usually implemented using the setInterval timer. But we don't know what the variable that stores the timer of this carousel is. If we want to stop this carousel, we can use the code just now to directly stop all timers.

How to clear all timers in javascript

#After executing the code just now in the console, I found that the carousel image had indeed stopped.

Wonderful!

[Recommended learning: javascript advanced tutorial]

The above is the detailed content of How to clear all timers in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template