2016-08-18 4 views
0

私は、(a)パラメータを必要とするイベントハンドラを持っており、(b)はwindow.setTimeoutでコールバック関数を呼び出しています。私はbindを使ってイベントハンドラをアタッチします。JavaScript:コールバックとパラメータを持つイベントリスナー

呼び出された関数は、追加のパラメータとともに呼び出されます。私はcallback(parameters)と `callback.call(this、パラメータ)の両方を試しました。以下は

は、コードサンプルです:

var element=document.querySelector('h1'); 
element.onclick=function(e) { 
    delay(test.bind(element,'from original','also from original',e)); 
} 
function test(a,b,c,d,e) { 
    alert(this); // element 
    alert(a);  // from original 
    alert(b);  // also from original 
    alert(c);  // event 
    alert(d);  // from delayed 
    alert(e);  // also from delayed 
} 
function delay(callback) { 
    window.setTimeout(delayed,100); 
    function delayed() { 
     // callback.call(this,'from delayed','also from delayed'); 
     callback('from delayed','also from delayed'); 
    } 
} 

I私のテスト、私は、コールバックは、次の順序でパラメータを取得することを見つける:元の関数

  • イベント自体から

    1. パラメータ
    2. コールバックを呼び出す関数のパラメータ

    さらに、私は、コールバック関数は、私は何も(でもnull)に設定this引数で.callを使用してそれを呼び出す場合でも、元の要素へthisセットを持っていることがわかります。

    私はこの確実性を扱うことができますが、これが正式にどのように処理されるのか混乱しています。コールバックを持つイベントリスナーについて説明しているドキュメントでは、何も見つかりません。

    質問です:パラメータの順序が文書化されている

    1. thisはどこから来たのですか?そして、どうしてそれを変更しようとする試みを無視しているように見えますか?

    おかげ

  • 答えて

    0

    あなたはbind()documentationで見ることができるように:

    バインド()メソッドは、呼び出されたときに、与えられた値に設定して、このキーワードを持つ新しい関数を作成し、新しい関数が呼び出されたときに、指定された引数のシーケンスが指定された引数の前に置かれます。

    ので、この行:test.bind(element,'from original','also from original',e)

    が呼び出されたときには、それらの後の最初のものを提供する引数を使用し、それ以降の引数になるという関数を返します。したがって、あなたの関数を呼び出すときには、上にリストした順序になります。 thisについては


    、問題は、あなたが期待しているものを得ることがない理由でバインド、後setTimeout()を使用していることです。 setTimeout()thishereについて詳しく読むことができます。

    関連する問題