somehow two intervals run simultaneously, despite the first one being cleared

In the code:

let nextInterval = function(){  
    if(score % 10 === 0) {
        speed -= 10;
    }
    if(internalScore === 20) {
        clearInterval(2);
        catchingEggs();
    }
    if(heartIndex<0) {
        clearInterval(2);
        return
    }
    eggIndex = Math.floor(Math.random()*4); 
    fallingEggs(allEggs[eggIndex], speed);
    }

setInterval(function(){  
    if(score % 10 === 0) {
        speed -= 10;
    }
    if(internalScore === 20) {
        clearInterval(1);
        setInterval (nextInterval,speed*3.5);
        return
    }
    if(heartIndex<0) {
        clearInterval(1);
        return
    }
    eggIndex = Math.floor(Math.random()*4); 
    fallingEggs(allEggs[eggIndex], speed);
    }, speed*3.5); 

when internalScore === 20 both intervals start running together, simultaneously. I use clearInterval() to stop the interval with ID 1, but as the nextInterval starts, the first one starts again.

I want to be able to reuse the same interval code (ideally with different variables). I tried starting new interval outside the function and upon a conditional, but that didn’t work either, JS simply goes through the code once, sees the conditional === false and don’t call second interval at all and if i put that conditional in a while loop, it crashes the browser.

so the above code is the closest i got to what i’m trying to do, but still not quite there.