ホームページ  >  記事  >  ウェブフロントエンド  >  非同期プログラミング コールバック、プロミス、非同期待機

非同期プログラミング コールバック、プロミス、非同期待機

WBOY
WBOYオリジナル
2024-09-11 06:43:021087ブラウズ

Asynchronous programming Callbacks, Promises & Async Await

JavaScript の非同期プログラミングを使用すると、他のコードの実行をブロックすることなく、API 呼び出し、ファイルの読み取り、データベースのクエリなどのタスクを実行できます。これは、JavaScript、特に応答性とパフォーマンスが鍵となる Web 開発において非常に重要です。

主要な概念

1.コールバック:

別の関数に引数として渡される関数。非同期操作の完了後に実行されます。

例:

関数 fetchData(コールバック) {
setTimeout(() => {
callback("データが取得されました");
}, 1000);
}

fetchData((データ) => {
console.log(データ);
});

2.約束:

非同期操作の最終的な完了または失敗を表すオブジェクト。

Promise は、保留中、履行済み、拒否の 3 つの状態のいずれかになります。

例:

let Promise = new Promise((解決、拒否) => {
setTimeout(() => {
solve("データが取得されました");
}, 1000);
});

約束
.then((データ) => console.log(データ))
.catch((エラー) => console.log(エラー));

3.非同期で待機:

非同期関数は自動的に Promise を返し、Promise の処理を​​簡素化するために使用されます。

await は、Promise が解決されるまで非同期関数の実行を一時停止し、コードの読み書きを容易にします。

例:

非同期関数 fetchData() {
{
を試してください let data = await new Promise((解決、拒否) => {
setTimeout(() => {
solve("データが取得されました");
}, 1000);
});
console.log(データ);
} キャッチ (エラー) {
console.log(エラー);
}
}

fetchData();

非同期パターン

コールバック地獄: コールバックが他のコールバック内にネストされ、コードの読み取りと保守が困難になる状況。

Promise Chaining: Promise を返し、.then() メソッドと .catch() メソッドを連鎖させることでコールバック地獄を回避するパターン。

Async/Await: 非同期コードを作成するための、より現代的でクリーンなアプローチ。Promise チェーンを回避し、コードをより同期的に見せます。

使用例

API 呼び出し: サーバーからデータを取得します。

タイマー: setTimeout または setInterval を使用します。

ファイル操作: ノンブロッキングな方法でのファイルの読み取りまたは書き込み。

イベント処理: クリック、キー押下などのイベントを処理します。

JavaScript での非同期プログラミングは、特に I/O バウンドの操作を扱う場合、応答性の高い効率的なアプリケーションを構築するために不可欠です。

以上が非同期プログラミング コールバック、プロミス、非同期待機の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。