1

私は ajax の学習を始めたばかりで、例で使用されている匿名コールバック関数の概念を理解できません。

function getData(dataSource, divID) 
  { 
    if(XMLHttpRequestObject) {
      var obj = document.getElementById(divID); 
      XMLHttpRequestObject.open("GET", dataSource); 

      XMLHttpRequestObject.onreadystatechange = function() 
      { 
        if (XMLHttpRequestObject.readyState == 4 && 
          XMLHttpRequestObject.status == 200) { 
            obj.innerHTML = XMLHttpRequestObject.responseText; 
        } 
      } 

      XMLHttpRequestObject.send(null); 
    }
  }

ここで匿名関数がトリガーされるのはいつですか? javascript はこの行を 1 行ずつ読み取りますか?

4

5 に答える 5

3

あなたのコードでは、あなたは:

  1. リクエストオブジェクトの作成
  2. そのオブジェクトにコールバックを割り当てます
  3. リクエストを送信します

割り当てた関数は、変更XMLHttpRequestObject.onreadystatechangeされると実行される無名関数の例ですreadyState。大まかな比較を行うには、にを追加するようなものです-値が変更onchangeされたときに、割り当てられた無名関数を実行します<select>

匿名関数は非常に重要であり、その1つはそれを使用して一連の「やること」を定義し、基本的に「やること」リストを別の操作に渡します。次に、その操作は必要なときにそれを実行します。この場合はonreadystatechange

あなたのコードは「非同期操作」の例でもあります。コードは上から下に実行されます。コールバックは「割り当てられた」だけなので、実行されません。リクエストを送信すると、この時点では応答を待機しません。実行後の残りのコードは、バックグラウンド操作のようになります。

値がreadyState変更されると、割り当てたばかりの関数XMLHttpRequestObject.onreadystatechangeが実行されます。状況、契約条項

XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200

その関数では、リクエストが完了し(4)、ページに問題がないか(200)を判断します。その場合、応答を使用する準備ができています。

于 2012-04-23T07:33:30.573 に答える
3

Javascriptの関数はファーストクラスのオブジェクトです。つまり、他の変数と同じように渡すことができます。

この線

XMLHttpRequestObject.onreadystatechange = function() { }

オブジェクトのonreadystatechangeプロパティをその関数に設定しています。ドキュメントXMLHttpRequestObjectを確認すると、この関数は「属性が変更されるたびに呼び出される」ことがわかります。readyState

于 2012-04-23T07:34:07.170 に答える
2

設定XMLHttpRequestObject.onreadystatechangeすると、実際にはクラスのメソッドが変更されるため、設定時に関数は実行されませんが、後で準備完了状態が変更されると...

readyState が変更されるたびに関数が呼び出されるので、そこにカウンターを設定すると

var counter = 0;

XMLHttpRequestObject.onreadystatechange = function() { console.log(counter++) };

console.log を調べると、onreadystatechange と同じ回数呼び出されることがわかります (anonymouse 関数をトリガーするイベントです)。

あなたは JavaScript と AJAX を学んでいるだけだと読みましたが、jQuery、Zepto などのクロスブラウザー サポートについて何かを参照することをお勧めします...

于 2012-04-23T07:35:20.663 に答える
2

ここから引用:

XMLHttpRequest オブジェクトの open メソッドが、3 番目のパラメーターを true に設定して非同期リクエストに対して呼び出された場合、onreadystatechange イベント リスナーは、XMLHttpRequest オブジェクトの readyState プロパティを変更する次の各アクションに対して自動的に呼び出されます。

つまり、readystate プロパティが変更されるたびにコールバックが呼び出されます。呼び出しは非同期であるため、これがいつ発生するかはわかりません (基本的にサーバーの応答時間に依存するため)。

于 2012-04-23T07:35:36.270 に答える
1

では、AJAX について順を追って説明します。

var request = new XMLHttpRequest;     // create a new HTTP Request
request.open("GET", "/resource.txt"); // set the method as GET and specify the URL to request for
request.onreadystatechange = handle;  // attach a handler which is called when the ready state of the request changes
request.send();                       // dispatch the HTTP Request

/*
    function to call when the ready state of the request changes
*/ 

function handle() {
    if (request.readyState === 4 && request.status === 200) {
        alert(request.responseText);  // if the ready state is 4 (complete) and the server sends a status of 200 (OK) then alert the contents of resource.txt which is stored in request.responseText
    }
}

今理解する:

  1. AJAX は、サーバーとの通信に使用されます。
  2. サーバーと通信するには、サーバーにメッセージ (an ) を送信する必要がありますXMLHttpRequest
  3. メッセージでは、メッセージが使用するメソッド ( 、 など) を指定しますGETPOST詳細については、こちらを参照してください
  4. メッセージの宛先アドレス (URL) を指定する必要があります。この場合は/resource.txt.
  5. 手紙ができたので、実際に送ります。郵便受けに入れる感じです。
  6. メールを配信するのは郵便局 (この場合はブラウザ) の問題です。
  7. ただし、メール ( ) のステータスを知りたい場合は、readyState変更されるたびに通知するようにブラウザに指示する必要があります。
  8. 通知を受けるには、 に関数を追加するだけonreadystatechangeです。メッセージの が変更されるたびにreadyState、ブラウザは自動的に関数を呼び出します。

メッセージの準備完了状態は次のとおりです。

  1. 0 (未初期化) - リクエストは初期化されていません
  2. 1 (読み込み中) - サーバー接続が確立されました
  3. 2 (ロード済み) - 要求を受け取りました
  4. 3 (インタラクティブ) - リクエストの処理
  5. 4 (完了) - 要求が終了し、応答の準備ができている

さて、何が起こっているのかを理解するために:

  1. メッセージを書いても送信しないのreadyState0、リクエストが初期化されていないためです (つまり、送信されていないか、メールボックスに入れられていません)。
  2. メールボックスにメッセージを入れた後、ブラウザはメッセージをサーバーに送信しようとします。この時点で にreadyStateなり1ます。
  3. メッセージ全体が配信されると、 は にreadyStateなり2ます。
  4. 次に、サーバーはメッセージへの返信を書き込み、メッセージの本文に要求されたコンテンツを入れます。サーバーが応答を書いているときは にreadyStateなり3ます。
  5. 最後に返信が届くと、 にreadyState変わります4

変更されるたびreadyStateに、ブラウザはonreadystatechange提供された関数を起動して、イベントが発生したことを通知します。シンプルですよね?

結論として、ステータス コードについて詳しく知りたい場合は、このページにアクセスしてください。

于 2012-04-23T07:59:31.177 に答える