時々混乱するので、メモとして書き残しておく。
基本概念「thisがなにを指すかは実行時に決まる。その関数をもつオブジェクト。」
var taro = {
name: "Taro",
hello: function(){
alert("Hello! " + this.name);
}
}
var hanako = {
name: "Hanako"
}
hanako.hello = taro.hello;
var helloFunc = taro.hello;
</code>
<script id="script" type="text/javascript">
var taro = {
name: "Taro",
hello: function(){
alert("Hello! " + this.name);
}
}
var hanako = {
name: "Hanako"
}
hanako.hello = taro.hello;
var helloFunc = taro.hello;
</script>
<p>
taro.hello();<button onClick="taro.hello()">Exec</button>→"Hello! Taro"
taroオブジェクトに属する関数helloを実行
</p>
<p>
hanako.hello();<button onClick="hanako.hello()">Exec</button>→"Hello! Hanako"
hanakoオブジェクトに属する関数helloを実行
</p>
<p>
helloFunc();<button onClick="helloFunc()">Exec</button>→"Hello! " (window.nameは"")
helloFunc関数を実行(this未指定はトップレベルオブジェクトになる。windowなど)
</p>
<p>
helloFunc.call(taro);<button onClick="helloFunc.call(taro)">Exec</button>→"Hello! Taro"
helloFunc関数を、taroオブジェクトをthisとして扱うように実行
</p>
<p>
helloFunc.call(hanako);<button onClick="helloFunc.call(hanako)">Exec</button>→"Hello! Hanako"
helloFunc関数を、hanakoオブジェクトをthisとして扱うように実行
</p>