this値について

ECMAスクリプトの仕様書の邦訳 によると…

アクティブな実行コンテキストそれぞれに結び付けられる this 値がある。 this 値は呼出側と実行されるコード型に依存し、制御が実行コンテキストに入るときに決定される。 実行コンテキストに結び付けられる this 値は不変である。

だそうである。 formなんかでよく使われるthis値だが、実際にどのような場合にどのような値を参照するのか試してみた。


<script type="text/javascript"><!--
function hoge(a){alert(a)}
//--></script>
<a href="URL" onclick="hoge(this.href);return false">リンク</a>
<br>
hrefの場合、this.hrefでもthisだけでもよい。
<br>
<a name="nanu" onclick="hoge(this.name);return false">リンク</a>
<br>
hrefと違って、thisだけだとnameを参照できない。this.nameなら参照できる。
<br>
<a name="nanu" href="URL" onclick="hoge(this);return false">リンク</a>
<br>
hrefを参照する。
<br>
<form name="abeshi" action="URL">
<input name="hidebu" type="text" value="ひでぶ" onclick="hoge(this.name)">
<br>
thisだけだと[object]になる。this.nameだとhidebuになる。
<br>
<input name="npepo" type="text" value="んぺぽ" onclick="hoge(this.form.name)">
<br>
this.formなら[object]。this.form.nameならabeshi。
<br>
<input type="text" value="おぱ" onclick="hoge(this.name)">
<br>
空文字列になる。
<br>
<input type="button" value="action" onclick="hoge(this.form.action)">
<br>
this.form.actionだとformのaction属性の値、this.actionだとundefinedになる。
<br>
<input type="button" value="reset" onclick="reset()">
<br>
reset()は引数がなくても動作する。カレントオブジェクトであるフォームのエレメントをすべてリセットする。
</form>

<img src="URL" onclick="alert(this.src)">
<br>
thisなら[object]。this.srcでsrc属性の値になる。