跳過到頁腳內容
NODE 說明

JavaScript 等待 5 秒鐘(開發者的使用方法)

在 JavaScript 中,等待特定時間(例如 5 秒)是常見的需求。 無論你是想延遲某個操作還是模擬載入狀態,了解如何在 JavaScript 中實現延遲對於同步程式碼來說都至關重要。 在本文中,我們將探討在 JavaScript 中等待 5 秒鐘的各種方法,並為每種方法提供暫停 JavaScript 執行的範例。 此外,我們將藉助IronPDF for Node.js,使用非同步函數和設定超時函數來建立 PDF 檔案。

1. 使用 setTimeout()

setTimeout()函數是 JavaScript 內建函數,它會在指定的毫秒延遲後執行指定的函數或程式碼片段。

範例

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

在這個範例中, setTimeout()函數內部的程式碼將在延遲 5000 毫秒(或 5 秒)後執行。

JavaScript 等待 5 秒(開發者如何操作):圖 1 - 使用 JavaScript setTimeout() 函數等待 5000 毫秒或 5 秒的控制台輸出。

2. 使用 Promise 和 async/await

您也可以將 Promises 與async/await結合使用,在 JavaScript 中建立延遲,也稱為非同步程式碼。

範例

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

在這個範例中, delay()函數使用async/await透過 Promise 暫停執行 5 秒鐘。

JavaScript 等待 5 秒(開發者如何操作):圖 2 - 使用 JavaScript setTimeout() 函數在 Promise 中非同步運行並等待 5000 毫秒或 5 秒的控制台輸出。

3. 使用 setInterval()

雖然setInterval()函數通常用於重複操作,但您也可以透過在所需時間後清除間隔來使用它來建立一次性延遲。

範例

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

在這裡, setInterval()函數每 5 秒重複執行提供的函數,直到我們使用clearInterval()函數清除間隔。

JavaScript 等待 5 秒(開發者如何操作):圖 3 - 使用 JavaScript setInterval() 方法等待 5000 毫秒或 5 秒的控制台輸出。 . 然後使用 clearInterval() 函數清除間隔。

4. 使用 new Promise()

你可以使用new Promise()建立一個在指定延遲後解析的 Promise。

範例

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

在這個範例中, delay()函數傳回一個 Promise,該 Promise 會在 5 秒後解析,我們使用.then()在延遲後執行程式碼。

JavaScript 等待 5 秒(開發者如何操作):圖 4 - 使用 Promise 和 JavaScript delay() 和 then() 函數等待 5 秒的控制台輸出。

5. IronPDF JS簡介

IronPDF JavaScript Library for PDF Generation提供了一個 JavaScript 程式庫,使開發人員能夠直接從客戶端 JavaScript 操作和產生 PDF 文件。 它提供了一系列功能,可以使用 JavaScript 建立、編輯和轉換 PDF 文件。

安裝 IronPDF JS

要開始使用 IronPDF JS,您需要在專案中包含 IronPDF JavaScript 庫。 你可以透過 CDN 將其加入系統中,也可以直接從 IronPDF 網站下載。

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

6. 使用 IronPDF 的 JavaScript 等待 5 秒

現在,讓我們看看如何將 JavaScript 程式碼延遲技術與 IronPDF 結合起來,使用非同步 JavaScript 解釋器在等待 5 秒鐘後創建 PDF 文檔,如下面的程式碼片段所示。

程式碼範例

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

在這段程式碼片段中,非同步函數使用async/awaitsetTimeout()等待 5 秒鐘。 延遲之後,它使用 IronPDF 的PdfDocument.fromHtml()方法建立一個新的 PDF 文檔,其中包含簡單的 HTML 內容。 您可以根據自身需求取代 PDF 產生程式碼,或使用產生的 PDF 資料進行進一步處理。

![JavaScript 等待 5 秒(開發者如何操作):圖 5 - 使用 JavaScript setTimeout() 函數並等待 5 秒的控制台輸出。 然後 IronPDF 程式碼運行,將 HTML 字串轉換為 PDF 文檔,並在控制台中顯示訊息"等待後建立 PDF"。

結論

在 JavaScript 中,等待特定時間是開發人員經常遇到的常見任務。 在本文中,我們探討了在 JavaScript 中等待 5 秒的各種方法,包括使用setTimeout() 、帶有async/await 的Promise、 setInterval()new Promise()以及 JavaScript sleep 函數。

此外,我們還引入了IronPDF JS ,用於使用 JavaScript 管理 PDF 文件。 如需更多程式碼範例,請造訪IronPDF Node.js 範例

透過了解這些技術和工具,您可以有效地在 JavaScript 應用程式中實現延遲,並將其用於更複雜的任務,例如產生 PDF 文件或執行非同步操作。 無論你是初學者還是經驗豐富的開發者,紮實掌握這些基礎知識都將提升你的編碼技能,並使你能夠編寫更有效率、更強大的 JavaScript 應用程式。

Darrius Serrant
全棧軟件工程師 (WebOps)

Darrius Serrant 擁有邁阿密大學計算機科學學士學位,目前任職於 Iron Software 的全栈 WebOps 市場營銷工程師。從小就迷上編碼,他認為計算既神秘又可接近,是創意和解決問題的完美媒介。

在 Iron Software,Darrius 喜歡創造新事物,並簡化複雜概念以便於理解。作為我們的駐場開發者之一,他也自願教學生,分享他的專業知識給下一代。

對 Darrius 來說,工作令人滿意因為它被重視且有實際影響。