Javascript-Promise学習ノート

5271 ワード

最近仕事が少し楽になって、以前いつも見ていた単語promiseを思い出して、辛抱強く勉強しました.
 
一:Promiseとは何ですか.どうしてこれがあるの?
まず、Promiseはjavascriptの非同期プログラミング時にコードを書く方法を解決するために発生したものです.
Javascriptの発展に伴い、非同期のシーンが増えています.フロントエンドにはAJAX、settimeoutなどがあり、バックエンドノードは非同期でもっと多い.従来のやり方では、様々なコールバックがコールバックを埋め込むことになります.コードは人を混乱させることができる.
このとき、CommonJSコミュニティは、when/then/resolveなどを使用して非同期のコードを組織する方法を定義するPromise/A+という仕様を提案しています.
この仕様は優雅なため、ブラウザがオリジナルでサポートしているPromise()、jQueryのdeferred、whenなど、相次いで多くの人がこの仕様を実現した.jsなど.
これらのライブラリはすべてこの仕様に合致しているので、1つ勉強すればいいです.私は主にjQueryのdeferredを勉強したので,本稿では主にこの実現について述べる.
 
二:jQueryのdeferred
まず、deferredの対象について、チェン一峰先生は詳しく書いた文章があります.
アドレスポイント .まず彼の文章を見てから、下を見続けることをお勧めします.
上記のようにpromiseはajaxのような非同期を解決するために行われているので、彼らの違いを比較してみましょう.
定番のjQueryのAJAXの書き方は
$.ajax({
    type: "get",
    url: "",
    success: function () {},
    error; function () {}
});

ここでsuccessとerrorパラメータは、成功/失敗時のコールバック関数です.
 
今ではjQueryのAJAXは
$.ajax({
    type; "get",
    url: ""
}).done(function () {}).fail(function () {});

成功するとdoneの関数が呼び出され、失敗するとfailの関数が呼び出されます.
 
ここを見ると疑問に思うかもしれませんが、done/failのこれらの方法はどのオブジェクトにありますか?$ajax()はどのオブジェクトを返しますか.なぜこの2つの方法がありますか.
答えは以下に紹介するDeferredオブジェクトです.
 
jQueryは新しいタイプのDeferredを提供しています.$を通過する.Deferred()を生成します.たとえば
var def = $.Deferred();

このdefはdone/fail/resolve/rejectなど多くの方法を継承している.
だからここで私たちも知っています.上の$です.ajax()は実はこのオブジェクトを返します.
 
deferredオブジェクトには多くの方法があります
ここではいくつかの一般的なものを紹介し、APIを参照してください.
 
まず自然にdefオブジェクトを生成します.ここにはいろいろな方法があります.例えば、
var def = $.Deferred();    //     
$.ajax({});    // ajax       def  
$.when();    // when        def  

ここ、$.when()は単独で、この方法は通常1つ以上のdeferredオブジェクトを受信し、これらのdeferredオブジェクトの状態状況に基づいて$を決定することができる.when()が返すオブジェクトの状態.使用シーンの1つは複数のajaxリクエストであり、そのうちの1つが失敗すると失敗とみなされる場合、$.when()には、$などの複数のajaxメソッドが入力.when($.ajax(), $.ajax()).そして$whenはdefオブジェクトを返します(この2つのリクエスト結果から判断します).
 
次にdefオブジェクトを得ると,このオブジェクトの状態を変える一連の方法が得られる.
def.resolve();    //  def         ,           def.done()     。
def.reject();    //  def         ,           def.fail()     。
def.notify();    // def     ,      def.progress()。

 
次にコールバックを設定する方法で、順序と上の対応、つまりどの状態がどのコールバックを呼び出すかを設定します.
def.done();    //   def.resolve();
def.fail();    //   def.reject();
def.progress();    //    def.notify();

//    
def.always();    //           
def.then();    //       ,        (done),  (fail)    (progress)

 
実はここまでの位置では、deferredオブジェクトの使い方もあまり悪くありません.しかしjQueryはいくつかのAPIを提供しています
//        
def.isRejected();
def.isResolved();
def.state();

これらのapiは、その名の通り、具体的には説明されず、上記のjQuery APIドキュメントを参照することができます.
 
もう1つの方法は、外部にdefオブジェクトを与えたい場合があります.その後、このオブジェクトは様々な状態のコールバックを設定することができますが、その状態を変更することはできません.では、
def.promise();

promieseオブジェクトを返します.deferredオブジェクトのサブセットです.done/failなどの方法で、resolve/rejectなどの方法はありません.主にdefオブジェクトの状態を外部に修正させないように保護するためです.
 
これで、promiseについては全部话し终わりましたが、皆さんは今から自分のプロジェクトに使うことができます.また、早めに新年の挨拶をして、羊の年が得意であることを祈っています.
 
 
 
当駅の文章を転載して作者と出典を明記してください
奇抜な花-http://www.cnblogs.com/season-huang/、いかなる商業用途にも使用しないでください