Promise の概要
Promise オブジェクトは、非同期操作のための統一インターフェイスを提供するために CommonJS ワーキング グループによって提案された仕様です。
では、約束とは何ですか?
まず第一に、これはオブジェクトであり、他の JavaScript オブジェクトと何ら変わりなく使用されます。次に、プロキシとして機能し、非同期操作と コールバック関数の間の仲介者として機能します。これにより、非同期操作に同期操作用のインターフェイスを持たせることができるため、プログラムは通常の同期実行プロセスを持ち、コールバック関数を層ごとにネストする必要がなくなります。
簡単に言えば、各非同期タスクはすぐに Promise オブジェクトを返すという考え方です。これにより、同期操作プロセスを使用できます。この Promises オブジェクトには、非同期タスクの完了後に呼び出されるコールバック関数を指定できる then メソッドがあります。
たとえば、非同期操作 f1 は Promise オブジェクトを返し、そのコールバック関数 f2 は次のように記述されます。
(new Promise(f1)).then(f2);
はじめに
Promise は JavaScript の非同期操作ソリューションであり、最近、bluebird などのプロジェクトで Promise ライブラリ クラスを使用している人をよく見かけます。 、q、jQuery.Defered やその他の Polyfill Promise メソッドを使用する場合、長い文書に目を通すのは本当に疲れるので好きではありません。
es5 の開発により、node はバージョン 0.12 で Promise をサポートするようになりました。クライアント側では、ほとんどのブラウザーも Promise をサポートします。以前のバージョンのブラウザーと互換性を持たせたい場合は、es5-shim などの Polyfill Promise を追加できます。 。以下で言うことはあまりありません。詳細な紹介を見てみましょう:
使用法
一般的なシナリオを約束します。
非同期コールバックの処理
複数の非同期関数の同期処理
非同期コールバックの非同期依存関係
統合エントリメソッドまたはエラー処理のカプセル化
1.非同期コールバック
非同期コールバックを処理するための Promise の基本的な使用法。
function Pro1(){ return new Promise(function(resolve, reject) { setTimeout(function(){ resolve('pro1') }, 300) }) } //调用 Pro1() .then(function(data){ console.log(data) //pro1 }) .catch(function(err){ throw new Error(err) })
2. 複数の非同期関数の同期処理
場合によっては、2 つの ajax を送信し、それらが一緒にデータを返すことができるようにする必要があるため、次のメソッドを使用できます。
function Pro1(){ return new Promise(function(resolve, reject) { setTimeout(function(){ resolve('pro1') }, 300) }) } function Pro2(){ return new Promise(function(resolve, reject) { setTimeout(function(){ resolve('pro2') }, 300) }) } //调用 var Pro = Promise.all([Pro1(), Pro2()]); Pro .then(function(data){ console.log(data[0], data[1]) //Pro1 Pro2 }) .catch(function(err){ throw new Error(err) })
3. 非同期コールバックへの非同期依存
1 つの非同期が別の非同期の戻り値に依存する一部のシナリオでは、次の使用法を使用できます。
例: 注文番号を使用して注文の詳細を非同期的に取得し、注文詳細の製品 ID を使用して 製品の詳細 を取得します。
function Pro1(orderId){ return new Promise(function(resolve, reject) { setTimeout(function(){ var orderInfo = { orderId: orderId, productIds: ['123', '456'] } resolve(orderInfo.productIds) }, 300) }) } function Pro2(productIds){ return new Promise(function(resolve, reject) { setTimeout(function(){ var products = productIds.map(function(productId){ return { productId: productId, name: '衣服' } }) resolve(products) }, 300) }) } //调用 Pro1('abc123') .then(function(productIds){ console.log('商品id',productIds) return Pro2(productIds) }) .then(function(products){ console.log('商品详情',products) }) .catch(function(err){ throw new Error(err) })
4. 統合されたエントリメソッドまたはエラー処理をカプセル化します
エラー処理
function ErrorHandler(promiseObj, rejectOrResOrCallback){ return promiseObj.then(null, function(err){ if(!err) }) }
以上がPromise の概要と一般的なメソッドの紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。