-1

Head First Ajax では、次の例が挙げられます。

function getDetails(itemName) {
  request = createRequest();
  if (request == null) {
    alert("Unable to create request");
    return;
  }
  var url= "getDetails.php?ImageID=" + escape(itemName);
  request.open("GET", url, true);
  request.onreadystatechange = displayDetails;//This references the function below
  request.send(null);
}

function displayDetails() {
  if (request.readyState == 4) {
    if (request.status == 200) {
      detailDiv = document.getElementById("description");
      detailDiv.innerHTML = request.responseText;
    }
  }
}

どんな施工なのか気になりrequest.onreadystatechange = displayDetails;ます。この本は、「これは関数呼び出しではなく、関数への参照です」と述べています。しかし、私はこれが本当に何を意味するのか理解していません。displayDetails関数を objectに割り当てると思いますrequest.onreadystatechangeが、この構造を使用する理由やタイミングがわかりません。

たとえば、次のようなことを行うのではなく、この構造を使用する利点は何ですか。

request.onreadystatechange = function () {
  if (request.readyState == 4) {
    if (request.status == 200) {
      detailDiv = document.getElementById("description");
      detailDiv.innerHTML = request.responseText;
    }
  }
}

また、それは関数型言語機能の例ですか?

4

6 に答える 6

1

request.onreadystatechange=displayDetails;がどのような構造であるか知りたいです。この本には、「これは関数への参照であり、関数呼び出しではない」と書かれています。しかし、これが本当に何を意味するのかわかりません。

基本的に、これは、特定のイベント（この場合はreadystatechange）のイベントハンドラーとして、事前定義された名前付き関数を割り当てることを意味します。

必要に応じて、匿名関数を割り当てることもできます。

request.onreadystatechange = function () {
    if (request.readyState == 4) {
        if (request.status == 200) {
            detailDiv = document.getElementById("description");
            detailDiv.innerHTML = request.responseText;
        }
    }
};
于 2013-01-08T18:49:26.710 に答える
1

2 つのコード例は、使用している用語で同等です。関数はメモリのどこかに座っています。そのメモリ位置 (そのアドレス) への参照を取得してどこかに保存すると、その保存された参照からその関数を実行できます。(Javascript では、この説明は実際に起こっていることの類推に近いことに注意してください。一部の言語では、それが実際に機能する方法です。)

コードの最初のビットでは、関数への参照が「displayDetails」という名前で保存されます。これは、コーディングの問題の可能性があるグローバル スコープ変数です。しかし、それは有効です。その参照が「request.onreadystatechange」にもコピーされることにも注意してください。

コードの 2 番目のビットでは、関数への参照が「request.onreadystatechange」に格納されます。

いずれにせよ、関数はリクエストが処理されているときに実行され、結果が返されたかどうかを確認します。

于 2013-01-08T18:54:13.537 に答える
1

はい、これは関数型言語機能の例です。関数はこれらの言語の第一級市民です。つまり、関数を変数に代入したり、渡したりすることもできます。

eventhandler = function () { }vsに関する質問についてeventhandler = somefunc、あなたは次のように述べています。

displayDetails関数をオブジェクトに割り当てると思いますrequest.onreadystatechangeが、この構造をいつ、なぜ使用するのかわかりません

requestオブジェクトには というプロパティがあります。これは、リクエストのプロパティが変更onreadystatechangeされたときに呼び出されるイベント ハンドラ関数を表します。readyStateそのため、この本では、関数呼び出しではなく、参照割り当てであると述べています。に割り当てるときに関数を呼び出すのではrequest.onreadystatechangeなく、そのイベントが発生したときにのみ呼び出されます。クリックと他のすべてのイベントはそのように機能します (基本的に非同期です)。

複数のイベントに同じハンドラーを使用する場合は、無名関数割り当ての代わりに関数参照を使用するのが理にかなっています。たとえば、Web ページの 2 つの異なる部分に 2 つの「保存」ボタンがある場合、同じハンドラ関数をそれらのクリック イベントに割り当てることができます。

于 2013-01-08T18:49:43.573 に答える
1

という関数を宣言しましたdisplayDetails。構文を少し無視すると、function実際に行っているのはオブジェクトの作成であり、ほぼvar displayDetails = something. を割り当てるときは、関数の呼び出しonreadystatechangeではなく、実際に関数を割り当てています。これは、 とが同じ参照であることを意味します。呼び出すことは、 を呼び出すことと同じです。request.onreadystatechangefunction displayDetails()...request.onreadystate()displayDetails()

于 2013-01-08T18:49:50.890 に答える
1

利点は、別の AJAX 要求displayDetailsのコールバックなど、他の場所で使用できることです。onreadystatechange

この特定のコールバックが使用される場所が 1 つしかない場合 (これはよくあることです)、無名関数式を使用する方がおそらくより明確です。そうすれば、リクエストの作成と処理を同じ場所で行うことができます。

別の注意として、displayDetails関数が別の関数のスコープ ( など) にネストされていない場合(function() { ... })()、グローバル スコープが汚染されます。

于 2013-01-08T18:49:55.363 に答える
1

オブジェクト request.onreadystatechange に displayDetails 関数を割り当てると思います

正確に。関数は Javascript のファースト クラス変数であり、オブジェクトや数値と同様に、変数に渡して格納することができます。実際、関数には実際には名前がなく、関数にアクセスするときは、変数を介してアクセスしているだけです。つまり、次のようなものです

function f() { }

実際には一種の構文糖衣です

var f = function(){ }

しかし、なぜ、いつこの構造を使用するのかわかりません。

関数は、(オブジェクト指向の意味で) オブジェクトと同じ種類の役割を果たします。特に、何らかの内部状態でそれらを閉じる場合です。オブジェクト指向言語で何かを単一のdoStuffまたはcallメソッドでオブジェクトに渡す場合、代わりに関数を渡すことができます。

于 2013-01-08T18:52:50.870 に答える