首頁 > web前端 > js教程 > 主體

非同步

王林
發布: 2024-09-11 06:36:37
原創
1051 人瀏覽過

非同步

JavaScript 中的非同步程式設計 允許您執行API 呼叫、讀取檔案或查詢資料庫等任務,而不會阻塞其他任務的執行程式碼。這在 JavaScript 中至關重要,尤其是在 Web 開發中,回應能力和效能是關鍵。

關鍵概念

1。回調:

作為參數傳遞給另一個函數的函數,該函數在非同步操作完成後執行。

範例:

function fetchData(callback) {
    setTimeout(() => {
        callback("Data fetched");
    }, 1000);
}

fetchData((data) => {
    console.log(data);
});
登入後複製

2。承諾:

表示非同步操作最終完成或失敗的物件。

承諾可以處於三種狀態之一:待定、已履行或已拒絕。

範例:

let promise = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("Data fetched");
    }, 1000);
});

promise
    .then((data) => console.log(data))
    .catch((error) => console.log(error));

登入後複製

3。非同步與等待:

非同步函數會自動傳回一個 Promise,並用於簡化 Promise 的處理。

await 暫停非同步函數的執行,直到 Promise 得到解決,使程式碼更易於閱讀和編寫。

範例:

async function fetchData() {
    try {
        let data = await new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve("Data fetched");
            }, 1000);
        });
        console.log(data);
    } catch (error) {
        console.log(error);
    }
}

fetchData();
登入後複製

非同步模式

回調地獄:回呼嵌套在其他回調中的情況,使得程式碼難以閱讀和維護。

Promise Chaining:一種透過返回 Promise 並連結 .then() 和 .catch() 方法來避免回調地獄的模式。

Async/Await:一種更現代、更簡潔的非同步程式碼編寫方法,可以避免 Promise 連結並使程式碼看起來更同步。

用例

API 呼叫:從伺服器取得資料。

計時器:使用 setTimeout 或 setInterval。

檔案操作:以非阻塞方式讀取或寫入檔案。

事件處理:處理點擊、按鍵等事件
.
.
.

JavaScript 中的非同步程式設計對於建立響應迅速、高效的應用程式至關重要,特別是在處理 I/O 密集型操作時。

以上是非同步的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板