質問: new MyDiv("div1");`と書いているけど、関数の引数nameにdiv1が入っていないということですか? 3「イベントとして登録された関数が "インスタンスのメソッドではない" からかも」とはどういうことですか? ### 質問2 また、コード2の下から3行目、第2引数のthisについてサイトで 「引数iにthisを渡している」 「外側の無名関数`function(i)`で利用できる変数とは変数iです。外側の無名関数が呼ばれた時点で、その引数はthisです。 このthisはコンストラクタ内で使用されたものであるから、このthisは確かにインスタンスを表します。つまり、ここでは変数iはMyDivのインスタンスであるのです。」 とありますが、この部分も理解できません。 初歩的な質問ですみません。よろしくお願いします。
回答: ### 質問1への関して > > this.div = document.createElement("div"); > > this.div.addEventListener > > > ページに表示されるdiv要素はthis.divには紐付けられていますが、Mydivそのものでは無いからではないでしょうか?click時に呼び出された関数のthisはdiv1のdomオブジェクトの方であり、Mydivのインスタンスでは無いといった感じ? > > addEventListener() を使って要素にハンドラ関数を設定したとき、ハンドラの中の this の値は要素への参照となります。これはハンドラに渡された event 引数の currentTarget プロパティの値と同じです。MDN > > > ### 質問2に関して (function(i){})(this) こういう構造になっています。functionを括弧で包むとその関数はそこで即時実行されます。 後方の括弧内の値は関数への引数に対応します。 「javascript 即時実行 引数」あたりでGoogle検索するとそれらしい記事がhitすると思います。 ここで引き渡されたthisは(その括弧の中では)未定義なので、this.div.addEventListener('click',(function(i){})(this),false);これの外まで探索され、そこにあるthisが参照されます。 「該当範囲に変数が無くても、外側にあるならばそれが使用される」のがクロージャーの特徴という主旨の記事なんじゃないかと思います。