Al hacer clic en el botón, se ejecuta la función setTimeout, que inicia un temporizador dentro de Javascript

Cuando ejecuta setTimeout , con el nombre de una función y una cantidad de milisegundos, inicia un temporizador interno en Javascript.

No tiene que hacer nada para activar esa función más tarde: Javascript lo hará automáticamente, una vez que se acabe el tiempo (o tan pronto como sea posible después, si Javascript está ocupado).

Aquí está su versión original (acortada):

 function myFunction() { alert("Hello"); }

 <h2>JavaScript Timing</h2> <p>After you click "Try it", you will get an alert after 3 seconds, UNLESS you click "Cancel" during that time.</p> <button onclick="myVar = setTimeout(myFunction, 3000)">Try it</button> <button onclick="clearTimeout(myVar)">Cancel</button>

Mostrando que no necesita el "myVar="

Solo necesitaba myVar= porque quería poder cancelar el temporizador. Cuando llama a setTimeout, (inmediatamente) devuelve un controlador al temporizador. Puede usar ese controlador para cancelar el temporizador.

Si no necesita la capacidad de cancelar, no necesita myVar= . Simplemente llame a setTimeout, así:

 function myFunction() { alert("Hello"); }

 <h2>JavaScript Timing</h2> <p>After you click "Try it", you will get an alert after 3 seconds.</p> <button onclick="setTimeout(myFunction, 3000)">Try it</button>

Mostrando que ni siquiera necesita la función Javascript separada

setTimeout puede recibir una definición completa de una función, en lugar de solo un nombre.

 <button onclick="setTimeout(function(){alert('Hello')}, 3000)">Try it</button>

Cómo funciona setTimeout

Javascript mantiene una lista de cosas que se le ha pedido que haga a intervalos (con setInterval ) o en momentos específicos (con setTimeout ).

Por lo general, continúa con el programa que está ejecutando, pero finalmente se queda sin cosas que hacer. Luego comienza a revisar esas listas de tareas pendientes, para ver si ha pasado suficiente tiempo para que estén listas para ejecutarse.

Este proceso, llamado "bucle de eventos" es bastante complicado. Afortunadamente no tenemos que preocuparnos por eso, salvo tener en cuenta que no es magia. Si tenemos un programa que requiere una larga ejecución de procesamiento, digamos 1 minuto, durante ese tiempo Javascript no buscará en las colas de interval y tiempos de timeout . Cuando termine la tarea del programa (o esté esperando la interacción de la red, etc.), comenzará a mirar eso.

Llamar a una función dentro de una declaración de variable ejecutará la función y asignará su valor de retorno a la variable.

Asignar una función a una variable, sin llamar, almacena el objeto de función dentro de ella. A continuación, se puede llamar a la variable para ejecutar la función.

En este caso, lo primero es cierto:

 const myVar = setTimeout(func, 1000)

Debido a que setTimeout se llama dentro de la declaración, se ejecuta. Su valor de retorno, que consiste en una identificación de temporizador, se asigna a la variable.