Search code examples
javascriptloopstypescriptdelay

Typescript Loop with Delay


I'm trying to create a metronome with Typescript.

I have this javascript code:

(function theLoop (i) {
        setTimeout(function () {
            metronome.play();
            if (--i) {
                theLoop(i);
            }
        }, 3000);          // interval set to 3000
    })(10);                // play it 10 times

And I wanted to convert it into Typescript code. Unfortunately I don't know how to do this (espacially regarding the last line => })(10);

Can someone help me with this?


Solution

  • As everyone said, typescipt is a superset of javascript so your code is valid typescript, but here's how to do it with an arrow function (which is also es6 javascript) and types:

    (function theLoop (i: number) {
            setTimeout(() => {
                metronome.play();
                if (--i) {
                    theLoop(i);
                }
            }, 3000);
        })(10);
    

    (code in playground)

    And here's another variation:

    let theLoop: (i: number) => void = (i: number) => {
        setTimeout(() => {
            metronome.play();
            if (--i) {
                theLoop(i);
            }
        }, 3000);
    };
    
    theLoop(10);
    

    (code in playground)


    Edit

    Using the 2nd option I gave you, changing the delay is easy:

    let theLoop: (i: number, delay?) => void = (i: number, delay = 3000) => {
        if (i % 2 === 0) {
            delay = 1500;
        }
    
        setTimeout(() => {
            metronome.play();
            if (--i) {
                theLoop(i);
            }
        }, delay);
    };
    
    theLoop(10);
    

    (code in playground)