{"id":2066,"date":"2023-04-07T00:00:00","date_gmt":"2023-04-07T00:00:00","guid":{"rendered":"https:\/\/electronica.guru\/con\/dominando-el-tiempo-con-javascript-funciones-sleep-y-settimeout\/"},"modified":"2023-04-07T00:00:00","modified_gmt":"2023-04-07T00:00:00","slug":"dominando-el-tiempo-con-javascript-funciones-sleep-y-settimeout","status":"publish","type":"post","link":"https:\/\/electronica.guru\/con\/dominando-el-tiempo-con-javascript-funciones-sleep-y-settimeout\/","title":{"rendered":"Dominando el Tiempo con JavaScript: Funciones Sleep y setTimeout"},"content":{"rendered":"
\n
<\/div>\n

JavaScript es un lenguaje de programaci\u00f3n vers\u00e1til que se ha convertido en una parte esencial del desarrollo web. Uno de los aspectos m\u00e1s importantes de la programaci\u00f3n es el control del tiempo, y JavaScript proporciona dos funciones para este prop\u00f3sito: sleep y setTimeout. En este art\u00edculo, vamos a discutir estas funciones y c\u00f3mo se pueden aplicar en la programaci\u00f3n JavaScript. <\/p>\n

<\/div>\n

La funci\u00f3n sleep se utiliza para pausar la ejecuci\u00f3n de un programa durante un cierto per\u00edodo de tiempo. Es una funci\u00f3n de bloqueo que espera el tiempo especificado antes de reanudar la ejecuci\u00f3n del programa. La funci\u00f3n sleep no es una funci\u00f3n incorporada en JavaScript, pero puede ser implementada usando setTimeout. La funci\u00f3n setTimeout se utiliza para ejecutar una funci\u00f3n o un fragmento de c\u00f3digo despu\u00e9s de un retardo especificado en milisegundos. <\/p>\n

<\/div>\n

Para implementar la funci\u00f3n sleep, podemos usar la funci\u00f3n setTimeout para ejecutar una funci\u00f3n an\u00f3nima auto-invocada despu\u00e9s del retardo especificado. La funci\u00f3n an\u00f3nima contendr\u00e1 el c\u00f3digo que queremos ejecutar despu\u00e9s del retardo. Por ejemplo, el siguiente c\u00f3digo pausar\u00e1 la ejecuci\u00f3n del programa durante un segundo: <\/p>\n

<\/div>\n
\u00ab<\/div>\n

function sleep(ms) { <\/p>\n

return new Promise(resolve => setTimeout(resolve, ms))<\/div>\n

} <\/p>\n

<\/div>\n
async function main() <\/div>\n

console.log(‘Antes de dormir’); <\/p>\n

await sleep(1000)<\/div>\n

console.log(‘Despu\u00e9s de dormir’); <\/p>\n

<\/div>\n

} <\/p>\n

<\/div>\n
main()<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

En este c\u00f3digo, la funci\u00f3n sleep se implementa como una Promise que se resuelve tras el retardo especificado. La funci\u00f3n main llama a la funci\u00f3n sleep con un retardo de un segundo usando la palabra clave await, que hace que el programa espere a que la Promise se resuelva antes de continuar la ejecuci\u00f3n. La salida de este c\u00f3digo ser\u00e1: <\/p>\n

<\/div>\n
\u00ab<\/div>\n

Antes de sleep <\/p>\n

Despu\u00e9s de slee<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

La funci\u00f3n setTimeout tambi\u00e9n se puede utilizar para ejecutar una funci\u00f3n o un fragmento de c\u00f3digo despu\u00e9s de un retardo. La sintaxis de la funci\u00f3n setTimeout es la siguiente: <\/p>\n

<\/div>\n
\u00ab<\/div>\n

setTimeout(function, delay, arg1, arg2, …) <\/p>\n

\u00ab<\/div>\n
<\/div>\n

El primer argumento es la funci\u00f3n o el c\u00f3digo que queremos ejecutar despu\u00e9s del retardo. El segundo argumento es el retardo en milisegundos. Cualquier argumento adicional se pasa a la funci\u00f3n como par\u00e1metros. <\/p>\n

<\/div>\n

Por ejemplo, el siguiente c\u00f3digo imprimir\u00e1 \u00ab\u00a1Hola, Mundo!\u00bb despu\u00e9s de un retardo de un segundo: <\/p>\n

<\/div>\n

\u00ab <\/p>\n

function sayHello(name) <\/div>\n

console.log(`Hola, !`); <\/p>\n

<\/div>\n

} <\/p>\n

setTimeout(sayHello, 1000, ‘World’)<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

En este c\u00f3digo, la funci\u00f3n sayHello es llamada con el argumento ‘World’ tras un retardo de un segundo usando la funci\u00f3n setTimeout. <\/p>\n

<\/div>\n

En conclusi\u00f3n, las funciones sleep y setTimeout son herramientas esenciales para controlar el tiempo en la programaci\u00f3n JavaScript. La funci\u00f3n sleep puede implementarse utilizando la funci\u00f3n setTimeout para pausar la ejecuci\u00f3n de un programa durante un periodo de tiempo especificado. La funci\u00f3n setTimeout puede utilizarse para ejecutar una funci\u00f3n o un fragmento de c\u00f3digo despu\u00e9s de un retardo. Dominando estas funciones, los programadores de JavaScript pueden crear aplicaciones web m\u00e1s sofisticadas y con mayor capacidad de respuesta.<\/p><\/div>\n

\n
FAQ<\/div>\n
\n
\u00bfC\u00f3mo usar la funci\u00f3n en setTimeout en JavaScript?<\/div>\n

Para utilizar una funci\u00f3n en setTimeout en JavaScript, puede pasar la funci\u00f3n como primer argumento a la funci\u00f3n setTimeout, y el tiempo de retardo como segundo argumento. Por ejemplo, si tienes una funci\u00f3n llamada \u00abmiFunci\u00f3n\u00bb que quieres ejecutar despu\u00e9s de un retardo de 1 segundo, puedes usar el siguiente c\u00f3digo: <\/p>\n

<\/div>\n

\u00ab <\/p>\n

<\/div>\n

setTimeout(miFunci\u00f3n, 1000); <\/p>\n

<\/div>\n

\u00ab <\/p>\n

<\/div>\n

Esto ejecutar\u00e1 \u00abmiFunci\u00f3n\u00bb despu\u00e9s de un retardo de 1 segundo (1000 milisegundos). Tambi\u00e9n puedes pasar argumentos a la funci\u00f3n a\u00f1adi\u00e9ndolos despu\u00e9s del tiempo de retardo: <\/p>\n

<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

setTimeout(miFunci\u00f3n, 1000, arg1, arg2); <\/p>\n

<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

Esto ejecutar\u00e1 \u00abmiFunci\u00f3n\u00bb despu\u00e9s de un retardo de 1 segundo, y pasar\u00e1 \u00abarg1\u00bb y \u00abarg2\u00bb como argumentos a la funci\u00f3n. <\/p>\n<\/div>\n

\n
\u00bfC\u00f3mo a\u00f1adir sleep a una funci\u00f3n en JavaScript?<\/div>\n

Para a\u00f1adir una funci\u00f3n sleep a una funci\u00f3n JavaScript, puedes utilizar la funci\u00f3n `setTimeout()`. La funci\u00f3n `setTimeout()` toma dos argumentos: una funci\u00f3n a ejecutar y un tiempo de retardo en milisegundos. He aqu\u00ed un ejemplo de c\u00f3mo a\u00f1adir una funci\u00f3n sleep a una funci\u00f3n JavaScript: <\/p>\n

<\/div>\n

\u00ab <\/p>\n

<\/div>\n

function myFunction() { <\/p>\n

<\/div>\n

\/\/ Hacer algo <\/p>\n

<\/div>\n

setTimeout(function() { <\/p>\n

<\/div>\n

\/\/ Hacer algo despu\u00e9s de un retraso de 1 segundo (1000 milisegundos) <\/p>\n

<\/div>\n

}, 1000); <\/p>\n

<\/div>\n

} <\/p>\n

<\/div>\n

\u00ab` <\/p>\n

<\/div>\n

En este ejemplo, la funci\u00f3n `setTimeout()` se utiliza para retrasar 1 segundo la ejecuci\u00f3n de la funci\u00f3n que contiene. Puedes ajustar el tiempo de retardo cambiando el segundo argumento de `setTimeout()`.<\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

JavaScript es un lenguaje de programaci\u00f3n vers\u00e1til que se ha convertido en una parte esencial del desarrollo web. Uno de los aspectos m\u00e1s importantes de la programaci\u00f3n es el control del tiempo, y JavaScript proporciona dos funciones para este prop\u00f3sito: sleep y setTimeout. En este art\u00edculo, vamos a discutir estas funciones y c\u00f3mo se pueden … Leer m\u00e1s<\/a><\/p>\n","protected":false},"author":1107,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-2066","post","type-post","status-publish","format-standard","hentry","category-wiki"],"_links":{"self":[{"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/posts\/2066","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/users\/1107"}],"replies":[{"embeddable":true,"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/comments?post=2066"}],"version-history":[{"count":0,"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/posts\/2066\/revisions"}],"wp:attachment":[{"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/media?parent=2066"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/categories?post=2066"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/electronica.guru\/con\/wp-json\/wp\/v2\/tags?post=2066"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}