關(guān)于js中的this關(guān)鍵字的文章已經(jīng)不少了，我看過(guò)幾篇，我寫(xiě)這篇文章的目的是從實(shí)例中分析出this的工作原理，希望對(duì)大家有所幫助。

一、基本的：

代碼如下:
function doSomething(){
alert(this.id);
}
alert(window.doSomething);//證明了doSomething是屬于window的
doSomething();//undefined
window.onload = function(){
document.getElementById("div2").onclick = doSomething;//div2
document.getElementById("div3").onclick = function(){doSomething();}//undefined
}

1、對(duì)于doSomething這個(gè)函數(shù)：
代碼如下:
function doSomething(){
alert(this.id);
}

這個(gè)函數(shù)是全局函數(shù)，這種全局函數(shù)實(shí)際上是屬于window的（可以通過(guò)window.doSomething來(lái)訪問(wèn)），如果直接調(diào)用，那么根據(jù)“this always refers to the “owner” of the function we're executing”，那么函數(shù)中的this就是window，但是window沒(méi)有id屬性，所以顯示“undefined”；

2、在html元素中這樣調(diào)用
代碼如下:
<div id="div1" onclick="doSomething();">div1</div>


這時(shí)也會(huì)顯示“undefined”，這就相當(dāng)于如下代碼：
代碼如下:
document.getElementById("div1").onclick = function(){doSomething();}

當(dāng)點(diǎn)擊div1時(shí)，調(diào)用屬于window的doSomething函數(shù)，所以也是顯示“undefined”；

3、通過(guò)js來(lái)綁定事件，在div2載入過(guò)后：
代碼如下:
document.getElementById("div2").onclick = doSomething;

當(dāng)點(diǎn)擊div2時(shí)，顯示“div2”，因?yàn)樵诮odiv2的onclick賦值，是將doSomething拷貝了一次，這時(shí)拷貝的這個(gè)函數(shù)是屬于div2的了，跟屬于window的doSomething沒(méi)有任何關(guān)系了。點(diǎn)擊div2時(shí)，就會(huì)觸發(fā)屬于div2的doSomething，這里的this就是指div2。

二、attachEvent和addEventListener

attachEvent是在ie中綁定事件的方法，會(huì)將相應(yīng)函數(shù)拷貝到全局（即響應(yīng)函數(shù)的owner為window），但是在DOM標(biāo)準(zhǔn)中，addEventListener綁定的事件時(shí)拷貝的響應(yīng)函數(shù)的owner為事件所綁定的對(duì)象
代碼如下:
function doSomething(){
alert(this.id);
alert(this == window);
}
window.onload = function(){
var div1 = document.getElementById("div1");
if(div1.attachEvent){
div1.attachEvent("onclick",doSomething);
document.body.appendChild(document.createTextNode("attachEvent"));
}else if(div1.addEventListener){
div1.addEventListener("click",doSomething,false);
document.body.appendChild(document.createTextNode("addEventListener"));
}else{
div.onclick = doSomething;
}
}


對(duì)于函數(shù)doSomething
代碼如下:
function doSomething(){
alert(this.id);
alert(this == window);
}

1、使用attachEvent綁定到div1的click事件上，doSometing會(huì)被復(fù)制到window，這時(shí)doSomething里面的this指的是window，點(diǎn)擊div1時(shí)會(huì)顯示“undefined”和“true”

2、使用addEventListener綁定div1的click事件，這時(shí)將doSomething拷貝，這個(gè)拷貝過(guò)后的函數(shù)是屬于div1的，所以點(diǎn)擊div1時(shí)會(huì)顯示“div1”和“false”