まず現象を見てみましょう: コードをコピーします コードは次のとおりです: ; <br>関数 init( ) { <br>var el = document.getElementById("testDiv"); <br>var a = new classA(el); <br>関数 classA(el); 🎜>this.a = 1 ; <br>this.container = el; <br>//バインドクリックイベント <br>this.container.onclick = this.click; <br>} <br>classA.prototype = { <br>クリック: function() { <br>alert(this.a); <br>} <br>} <br></body> ; <br><br> <br>DIV をクリックすると、ポップアップ ボックスに未定義が表示されます。 <br>その理由は、DOM オブジェクトがクリック イベントに応答するときに、イベント メソッドの this キーワードが DOM オブジェクトを指しているためです。このとき、DOM オブジェクトには属性がないため、未定義のポップアップが表示されます。 <br>プログラマの本来の意図は、応答イベント メソッド内の this が classA のオブジェクト a を指すことです。これはどのように実現できるでしょうか。これには、call または apply メソッドを使用する必要があります。 <br>呼び出しメソッドについて理解しましょう: <br>概要: </div>function.call(thisobj, args…) <br>パラメータ: <br>thisobj <br> 呼び出し関数のオブジェクト。関数本体では、thisobj はキーワード this の値です。 <br>args… <br> 任意の数のパラメーター。これらのパラメーターは関数 function に渡されます。 <br>戻り値: <br>呼び出した関数 function の戻り値。 <br>スロー: <br>TypeError <br> 関数を呼び出しているオブジェクトが関数ではない場合、この例外がスローされます。 <br>説明: <br>call() は、オブジェクト thisobj のメソッドとして指定された関数 function を呼び出し、パラメーター リストの thisobj 以降のパラメーターをそれに渡します。戻り値は、関数呼び出し後の戻り値です。関数本体内で、キーワード this は thisobj オブジェクトを参照します。 <br>指定した配列を関数のパラメータとして渡す場合は、Function.apply()メソッドを使用してください。 <br>call() メソッドに慣れたら、コード 1 を次のように変更します。 <br>コード 2: <br><br><br><br><br>コードをコピー <br><br><div class="codetitle"> コードは次のとおりです:<span><a style="CURSOR: pointer" data="75299" class="copybut" id="copybut75299" onclick="doCopy('code75299')"> <u><html> </u><head> </a></head> <body onload=" init()"> </span><div id="testDiv" style="位置: 絶対; 境界線: 1px ソリッド グレー; 幅: 100px; 高さ: 100px"></div> ; </div>< script type="text/javascript"> <div class="codebody" id="code75299">function init() { <br>var el = document.getElementById("testDiv"); ; <br>} <br>関数 classA(el) { <br>this.t = 1; <br>this.clickDele = createDele(this.click, this); <br>} <br>classA.prototype = { <br>click:function() { <br>alert(this.t); <br>} <br>} <br>function createDele(fun, obj, arg) ) { <br>return function() { <br>return fun.call(obj, arg) <br>} <br>} <br>