ホームページ  >  記事  >  ウェブフロントエンド  >  Javascript のアーティファクト - Promise

Javascript のアーティファクト - Promise

黄舟
黄舟オリジナル
2017-02-10 09:58:381084ブラウズ

js での約束

コールバック関数の本当の問題は、return キーワードと throw キーワードを使用する能力が奪われることです。 Promise はこれらすべてをうまく解決します。

2015 年 6 月、ECMAScript 6 の正式版がついにリリースされました。

ECMAScript は JavaScript 言語の国際標準であり、JavaScript は ECMAScript の実装です。 ES6 の目標は、JavaScript 言語を使用して大規模で複雑なアプリケーションを作成できるようにし、エンタープライズ レベルの開発言語になることです。

Concept

ES6 はネイティブに Promise オブジェクトを提供します。

いわゆる Promise は、非同期操作のメッセージを配信するために使用されるオブジェクトです。これは結果が将来になるまで分からないイベント (通常は非同期操作) を表し、このイベントはさらなる処理のための統合 API を提供します。

Promiseオブジェクトには以下の2つの特徴があります。

(1) オブジェクトの状態は外界の影響を受けません。 Promise オブジェクトは非同期操作を表し、保留中 (進行中)、解決済み (完了、フルフィルドとも呼ばれる)、拒否済み (失敗) の 3 つの状態があります。非同期操作の結果のみが現在の状態を決定でき、他の操作はこの状態を変更できません。英語で「約束」を意味し、他の手段では変えられないという意味を持つプロミスの名前の由来でもあります。

(2) 一度変化したステータスは再度変化せず、いつでもこの結果が得られます。 Promise オブジェクトの状態が変化する可能性は 2 つだけです。保留中から解決済みへ、および保留中から拒否へです。この 2 つの状況が発生する限り、状態は固定され、再び変化することはなく、この結果が維持されます。すでに変更が行われている場合でも、Promise オブジェクトにコールバック関数を追加すると、すぐに結果が得られます。イベントとは全く違いますが、聞き逃してまた聞き直すと結果が出ないのがイベントの特徴です。

Promise オブジェクトを使用すると、入れ子になったコールバック関数の層を回避して、非同期操作を同期操作プロセスとして表現できます。さらに、Promise オブジェクトは統一されたインターフェイスを提供するため、非同期操作の制御が容易になります。

Promiseにはいくつかのデメリットもあります。まず、Promiseは一度作成するとすぐに実行され、途中でキャンセルすることはできません。次に、コールバック関数が設定されていない場合、Promise によって内部的にスローされたエラーは外部には反映されません。第三に、保留状態の場合、現在の進行状況がどの段階にあるのか (開始されたばかりか、完了しようとしているか) を知ることはできません。

var promise = new Promise(function(resolve, reject) { if (/* 异步操作成功 */){
 resolve(value);
 } else {
 reject(error);
 }
});

promise.then(function(value) { // success
}, function(value) { // failure
});

Promise コンストラクターは関数をパラメーターとして受け取ります。関数の 2 つのパラメーターは、resolve メソッドと拒否メソッドです。

非同期操作が成功した場合は、resolve メソッドを使用して Promise オブジェクトの状態を「未完了」から「成功」(つまり、保留中から解決済み) に変更します。

非同期操作が失敗した場合は、reject メソッドを使用します。 Promise オブジェクトを変更します。ステータスが「未完了」から「失敗」に変わります (つまり、保留中から拒否されました)。

基本API

  1. Promise.resolve()

  2. Promise.reject()

  3. Promise.prototype.then()

  4. Promise.prototype.catch()

  5. 約束。 all() // すべて完了しました

     var p = Promise.all([p1,p2,p3]);
  6. Promise.race() // レーシング、1 つだけ完了してください

Advanced

Promise は前の return と throw を提供するもので、各 Promise は then() を提供します関数と catch() (実際には then(null, ...) 関数です。

    somePromise().then(functoin(){        // do something
    });

1. 同期コードと非同期コードをカプセル化する

1. return 另一个 promise2. return 一个同步的值 (或者 undefined)3. throw 一个同步异常 ` throw new Eror('');`

2. 同期例外をキャプチャする

"
new Promise(function (resolve, reject) {
 resolve(someValue);
 });
"
写成

"
Promise.resolve(someValue);
"
)。

同期コードの場合は、

 new Promise(function (resolve, reject) { throw new Error('悲剧了,又出 bug 了');
 }).catch(function(err){ console.log(err);
 });

3. 複数の例外のキャプチャ、より正確なキャプチャ

    Promise.reject(new Error("什么鬼"));

4. 最後に

somePromise.then(function() { return a.b.c.d();
}).catch(TypeError, function(e) { 
//If a is defined, will end up here because //it is a type error to reference property of undefined
}).catch(ReferenceError, function(e) { //Will end up here if a wasn't defined at all
}).catch(function(e) { //Generic catch-the rest, error wasn't TypeError nor //ReferenceError
});

6の戻り値を取得します。

または、これを行うこともできます

1. .then 方式顺序调用2. 设定更高层的作用域3. spread

ただし、多くの違いがあります。

リソースの無駄遣いとメモリリークのリスクがあることを最初に宣言する必要があります

  1. を式のコンテキストに配置するために使用することはできません

  2. は効率が悪い

  3. 7. すべて。動的にサイズ設定された Promise リストの結合を処理するのに非常に便利です

    8。複数の分離された Promise
  4. 任何情况下都会执行的,一般写在 catch 之后
9 の処理に最適です。 Promise のマップ コレクションを処理します。 1 つが失敗した場合のみ、すべての実行が終了します

somethingAsync().bind({})
.spread(function (aValue, bValue) { this.aValue = aValue; this.bValue = bValue; return somethingElseAsync(aValue, bValue);
})
.then(function (cValue) {     return this.aValue + this.bValue + cValue;
});

10. any、some、race

var scope = {};
somethingAsync()
.spread(function (aValue, bValue) { scope.aValue = aValue; scope.bValue = bValue;
 return somethingElseAsync(aValue, bValue);
})
.then(function (cValue) {
 return scope.aValue + scope.bValue + cValue;
});

err.forEach(function(e) {

console.error(e.stack);

});

});
"var join = Promise.join;join(getPictures(), getComments(), getTweets(),
 function(pictures, comments, tweets) {
 console.log("in total: " + pictures.length + comments.length + tweets.length);
});
"

11. .map(関数マッパー[, オブジェクトオプション])

"
Promise.props({ pictures: getPictures(),
 comments: getComments(),
 tweets: getTweets()
}).then(function(result) {
 console.log(result.tweets, result.pictures, result.comments);
});
"

オプション:同時実行数と見つかった
"Promise.some([
 ping("ns1.example.com"),
 ping("ns2.example.com"),
 ping("ns3.example.com"),
 ping("ns4.example.com")
], 2).spread(function(first, second) { console.log(first, second);
}).catch(AggregateError, function(err) {

以下は、ファイル情報を読み取る無制限の数です

"
有可能,失败的 promise 比较多,导致,Promsie 永远不会 fulfilled

結果

用于处理一个数组,或者 promise 数组,

11.関数リデューサー [, 動的初期値]) -> Promise

    map(..., {concurrency: 1});

12.Time

.timeout(int ms [, String message]) ->約束

    約束の実現
  1. q
  2. bluebird

    co
  1. いつ

ASYNC

async 関数は、Promise 関数や Generator 関数と同様、コールバック関数を置き換え、非同期操作を解決するために使用されるメソッドです。これは本質的にジェネレーター関数の糖衣構文です。 async 関数は ES6 の一部ではありませんが、ES7 には含まれています。

上記は Javascript のアーティファクトである Promise のコンテンツです。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。


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