コンテンツにスキップ

JavaScript/Promise

出典: フリー教科書『ウィキブックス(Wikibooks)』


Promise は、非同期処理の最終的な完了(または失敗)とその結果値を表すオブジェクトです。このオブジェクトは、将来的に利用可能になる可能性のある値に対する代理として機能します[1]

構文

[編集]
newPromise(executor);
  • executor: resolve 関数と reject 関数を引数に取るコールバック関数。Promise が作成されると、この関数は自動的に実行されます。

[編集]

基本的な Promise の使用例

[編集]

以下のプログラムは、基本的な Promise の使用方法を示しています。

constmyPromise=newPromise((resolve,reject)=>{setTimeout(()=>{resolve('成功!');},1000);});myPromise.then(value=>console.log(value))// 1秒後に "成功!" が出力されます.catch(error=>console.error(error));

このプログラムでは、1秒後に解決される Promise を作成し、then メソッドを使用して解決時の処理を登録しています。Promise が解決されると、「成功!」というメッセージが出力されます。

Promise チェーンの例

[編集]

以下のプログラムは、複数の Promise をチェーンする方法を示しています。

functionfetchData(){returnnewPromise((resolve)=>{setTimeout(()=>resolve('データ'),1000);});}functionprocessData(data){returnnewPromise((resolve)=>{setTimeout(()=>resolve(data+'の処理完了'),1000);});}fetchData().then(data=>processData(data)).then(result=>console.log(result))// 2秒後に "データの処理完了" が出力されます.catch(error=>console.error(error));

このプログラムでは、fetchData 関数から返された Promisethen メソッドを連鎖させて、最初の Promise が解決された後に processData 関数を呼び出しています。最終的に、2秒後に「データの処理完了」というメッセージが出力されます。

Promise.all の使用例

[編集]

以下のプログラムは、Promise.all メソッドを使用して複数の Promise を並行して実行する方法を示しています。

constpromise1=Promise.resolve(3);constpromise2=newPromise((resolve)=>setTimeout(()=>resolve('foo'),100));constpromise3=fetch('https://example.com/data');Promise.all([promise1,promise2,promise3]).then(values=>console.log(values))// [3, "foo", Response].catch(error=>console.error(error));

このプログラムでは、Promise.all メソッドを使用して3つの Promise を並行して実行し、すべての Promise が解決されると、結果の配列が出力されます。いずれかの Promise が拒否された場合、catch ハンドラーが呼び出されます。

注意点

[編集]
  • 状態: Promise は「保留中(pending)」、「成功(fulfilled)」、「失敗(rejected)」の3つの状態のいずれかを持ちます。
  • 不変性: Promise が一度成功または失敗すると、その状態と結果は変更できません。
  • 非同期: Promisethen および catch メソッドは、常に非同期的に実行されます。
  • エラーハンドリング: Promise チェーン内で発生したエラーは、最も近い catch ハンドラーに伝播します。

静的プロパティ

[編集]
Promise.length
Promise.name
Promise.prototype

静的アクセサ

[編集]
Promise [ Symbol.species ] (accessor)

静的メソッド

[編集]
Promise.all()
Promise.allSettled()
Promise.any()
Promise.race()
Promise.reject()
Promise.resolve()
Promise.try()
Promise.withResolvers()

インスタンスプロパティ

[編集]
Promise.prototype [ Symbol.toStringTag ]

インスタンスアクセサ

[編集]

インスタンスメソッド

[編集]
Promise.prototype.catch()
Promise.prototype.constructor()
Promise.prototype.finally()
Promise.prototype.then()

脚註

[編集]
  1. ^これは、非同期操作の結果を扱うために使用されます。

外部リンク

[編集]
close