Passer au contenu du pied de page
AIDE NODE

Attendre 5 secondes en JavaScript (Comment ça marche pour les développeurs)

En JavaScript, attendre une durée spécifique, telle que 5 secondes, est une exigence courante. Que vous souhaitiez retarder une action ou simuler un état de chargement, comprendre comment implémenter un délai en JavaScript est essentiel avec le code synchrone. Dans cet article, nous explorerons diverses méthodes pour attendre 5 secondes en JavaScript, avec des exemples pour chaque méthode pour suspendre l'exécution de JavaScript. De plus, nous créerons des fichiers PDF à l'aide de IronPDF for Node.js en utilisant des fonctions asynchrones et des fonctions set timeout.

1. Utiliser setTimeout()

La fonction setTimeout() est une fonction JavaScript intégrée qui exécute une fonction spécifiée ou un extrait de code après un délai de temps spécifié en millisecondes.

Exemple

console.log("Start");

// Schedules a function to be executed after 5000 milliseconds (5 seconds)
setTimeout(() => {
    console.log("Waited for 5 seconds");
}, 5000);

console.log("End");
console.log("Start");

// Schedules a function to be executed after 5000 milliseconds (5 seconds)
setTimeout(() => {
    console.log("Waited for 5 seconds");
}, 5000);

console.log("End");
JAVASCRIPT

Dans cet exemple, le code à l'intérieur de la fonction setTimeout() s'exécutera après un délai de 5000 millisecondes (ou 5 secondes).

JavaScript Attendre 5 Secondes (Comment cela fonctionne pour les développeurs) : Figure 1 - Sortie de la console utilisant la fonction JavaScript setTimeout() et attente de 5000 millisecondes ou 5 secondes.

2. Utiliser les Promesses et async/await

Vous pouvez également utiliser les Promesses avec async/await pour créer un délai en JavaScript, également connu sous le nom de code asynchrone.

Exemple

async function delay() {
    console.log("Start");
    // Creates a promise that resolves after 5000 milliseconds (5 seconds)
    await new Promise(resolve => setTimeout(resolve, 5000));
    console.log("Waited for 5 seconds");
    console.log("End");
}

// Call the async function
delay();
async function delay() {
    console.log("Start");
    // Creates a promise that resolves after 5000 milliseconds (5 seconds)
    await new Promise(resolve => setTimeout(resolve, 5000));
    console.log("Waited for 5 seconds");
    console.log("End");
}

// Call the async function
delay();
JAVASCRIPT

Dans cet exemple, la fonction delay() utilise async/await pour suspendre l'exécution pendant 5 secondes en utilisant une Promesse.

JavaScript Attendre 5 Secondes (Comment cela fonctionne pour les développeurs) : Figure 2 - Sortie de la console utilisant la fonction JavaScript setTimeout() asynchrone dans une Promesse et attente de 5000 millisecondes ou 5 secondes.

3. Utiliser setInterval()

Bien que la fonction setInterval() soit généralement utilisée pour des actions répétées, vous pouvez également l'utiliser pour créer un délai unique en effaçant l'intervalle après le temps souhaité.

Exemple

console.log("Start");

let timer = setInterval(() => {
    console.log("Waited for 5 seconds");
    // Clear the interval after the desired delay
    clearInterval(timer);
}, 5000);

console.log("End");
console.log("Start");

let timer = setInterval(() => {
    console.log("Waited for 5 seconds");
    // Clear the interval after the desired delay
    clearInterval(timer);
}, 5000);

console.log("End");
JAVASCRIPT

Ici, la fonction setInterval() répète la fonction fournie toutes les 5 secondes jusqu'à ce que nous effacions l'intervalle avec la fonction clearInterval().

JavaScript Attendre 5 Secondes (Comment cela fonctionne pour les développeurs) : Figure 3 - Sortie de la console utilisant la méthode JavaScript setInterval() et attente de 5000 millisecondes ou 5 secondes. . Ensuite, effacement de l'intervalle en utilisant la fonction clearInterval()

4. Utiliser new Promise()

Vous pouvez créer une Promesse qui se résout après un délai spécifié en utilisant new Promise().

Exemple

console.log("Start");

// Delay function that returns a promise which resolves after `ms` milliseconds
const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));

// Use the delay function
delay(5000).then(() => {
    console.log("Waited for 5 seconds");
    console.log("End");
});
console.log("Start");

// Delay function that returns a promise which resolves after `ms` milliseconds
const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));

// Use the delay function
delay(5000).then(() => {
    console.log("Waited for 5 seconds");
    console.log("End");
});
JAVASCRIPT

Dans cet exemple, la fonction delay() retourne une Promesse qui se résout après 5 secondes, et nous utilisons .then() pour exécuter le code après le délai.

JavaScript Attendre 5 Secondes (Comment cela fonctionne pour les développeurs) : Figure 4 - Sortie de la console utilisant une Promesse et les fonctions JavaScript delay() et then() et attente de 5 secondes.

5. Introduction à IronPDF JS

IronPDF Librairie JavaScript pour la génération de PDF fournit une bibliothèque JavaScript qui permet aux développeurs de manipuler et de générer des documents PDF directement à partir de JavaScript côté client. Elle offre une gamme de fonctionnalités pour créer, éditer et convertir des fichiers PDF en utilisant JavaScript.

Installer IronPDF JS

Pour commencer à utiliser IronPDF JS, vous devez inclure la bibliothèque JavaScript IronPDF dans votre projet. Vous pouvez l'inclure via CDN ou en la téléchargeant directement depuis le site IronPDF.

npm install @ironsoftware/ironpdf
npm install @ironsoftware/ironpdf
SHELL

6. Utiliser l'attente de 5 secondes en JavaScript avec IronPDF

Maintenant, voyons comment nous pouvons combiner les techniques de délai de code JavaScript avec IronPDF pour créer un document PDF après avoir attendu 5 secondes en utilisant un interprète JavaScript asynchrone dans l'extrait de code suivant.

Exemple de code

import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    const html = `<html><body><h1>Hello, IronPDF!</h1></body></html>`;
    // Wait for 5 seconds
    await new Promise(resolve => setTimeout(resolve, 5000));
    // Create PDF from the HTML content
    const pdfDocument = await PdfDocument.fromHtml(html);
    // Save the PDF file
    await pdfDocument.saveAs("Waited.pdf");  
    console.log("PDF Created after wait");
})();
import { PdfDocument } from "@ironsoftware/ironpdf";

(async () => {
    const html = `<html><body><h1>Hello, IronPDF!</h1></body></html>`;
    // Wait for 5 seconds
    await new Promise(resolve => setTimeout(resolve, 5000));
    // Create PDF from the HTML content
    const pdfDocument = await PdfDocument.fromHtml(html);
    // Save the PDF file
    await pdfDocument.saveAs("Waited.pdf");  
    console.log("PDF Created after wait");
})();
JAVASCRIPT

Dans cet extrait de code, la fonction async attend pendant 5 secondes en utilisant async/await et setTimeout(). Après le délai, elle crée un nouveau document PDF en utilisant la méthode PdfDocument.fromHtml() d'IronPDF avec un contenu HTML simple. Vous pouvez remplacer le code de génération de PDF par vos exigences spécifiques ou utiliser les données PDF générées pour un traitement ultérieur.

JavaScript Attendre 5 Secondes (Comment cela fonctionne pour les développeurs) : Figure 5 - Sortie de la console utilisant la fonction JavaScript setTimeout() et attente de 5 secondes. Ensuite, le code IronPDF s'exécute pour convertir la chaîne HTML en document PDF et affiche le message « PDF Created after wait » dans la console.

Conclusion

Attendre une durée spécifique en JavaScript est une tâche courante que les développeurs rencontrent souvent. Dans cet article, nous avons exploré diverses méthodes pour attendre 5 secondes en JavaScript, y compris l'utilisation de setTimeout(), de Promesses avec async/await, de setInterval(), et de new Promise() et de la fonction sommeil JavaScript.

De plus, nous avons présenté IronPDF JS pour gérer les fichiers PDF en utilisant JavaScript. Pour plus d'exemples de code, visitez les Exemples IronPDF Node.js.

En comprenant ces techniques et outils, vous pouvez implémenter efficacement des délais dans vos applications JavaScript et les utiliser dans des tâches plus complexes, telles que la génération de documents PDF ou la réalisation d'opérations asynchrones. Que vous soyez débutant ou développeur expérimenté, avoir une solide compréhension de ces fondamentaux améliorera vos compétences en codage et vous permettra d'écrire des applications JavaScript plus efficaces et robustes.

Darrius Serrant
Ingénieur logiciel Full Stack (WebOps)

Darrius Serrant est titulaire d'un baccalauréat en informatique de l'université de Miami et travaille comme ingénieur marketing WebOps Full Stack chez Iron Software. Attiré par le codage dès son plus jeune âge, il a vu l'informatique comme à la fois mystérieuse et accessible, en faisant le ...

Lire la suite