JavaScript: uso detallado de setInterval()

1 gramática básica

setInterval() es una función integrada en JavaScript, que se utiliza para ejecutar repetidamente un fragmento de código en un intervalo específico para realizar operaciones periódicas. La sintaxis de esta función es la siguiente:

setInterval(function, milliseconds, param1, param2, ...)

2 Descripción del parámetro

  • function: requerido, la función o bloque de código a ejecutar repetidamente.
  • milliseconds: requerido, el intervalo de tiempo en milisegundos entre ejecuciones repetidas.
  • param1, param2, ...: Opcional, parámetro pasado a la función a ejecutar. Omita este parámetro si no es necesario pasar ningún parámetro.

Aviso:

Si el primer argumento de la función setInterval() es una función, se llamará a esa función después de cada intervalo hasta que se cancele el temporizador.

Si el primer parámetro de la función setInterval() es una cadena, la cadena se interpretará como una pieza de código JavaScript que se ejecutará. Este uso ha quedado en desuso y no se recomienda.

Si el intervalo de tiempo de la función setInterval() se establece en 0 o en un número negativo, la función ejecutará la función o el código indicado por el primer parámetro inmediatamente y no se ejecutará periódicamente.

Si el intervalo de tiempo de la función setInterval() se establece en un valor pequeño, el temporizador puede ser inexacto debido a las limitaciones de rendimiento del navegador. Se recomienda establecer el intervalo de tiempo en 100 milisegundos o más para mantener la precisión del temporizador.

3 Ejemplo de uso

Use una función anónima como primer parámetro para generar la hora actual, y el intervalo es de 1000 milisegundos o 1 segundo.

// 每秒钟输出一次当前时间
setInterval(function() {
    
    
  console.log(new Date().toLocaleTimeString());
}, 1000);

4 Detenga el método setInterval()

El método setInterval() devolverá una ID de temporizador, que se puede usar para cancelar la ejecución del temporizador, de la siguiente manera:

intervalId = setInterval(function() {
    
    
  console.log(new Date().toLocaleTimeString());
}, 1000);

clearInterval(intervalId );

Entre ellos, intervalId se encuentra una variable utilizada para guardar el ID del objeto del temporizador devuelto por el método setInterval(). Después de llamar al método clearInterval(), se puede cancelar la ejecución del temporizador.

Ejemplo: Después de imprimir 5 veces, cancelar la ejecución del temporizador.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        var counter = 0;
        maxNum = 5;
        function myFunc() {
      
      
            var date = new Date();
            console.log(date.toLocaleTimeString());
            counter++;
            if (counter == maxNum) {
      
      
                clearInterval(intervalId);
                console.log('已打印' + maxNum + "次");
            }
        }

        var intervalId = setInterval(myFunc, 1000);
    </script>
</body>

</html>

Imprimir resultado:

inserte la descripción de la imagen aquí

Supongo que te gusta

Origin blog.csdn.net/weixin_46098577/article/details/131009965
Recomendado
Clasificación