對于常年使用C++,C#,Java等這些面向?qū)ο笳Z言的程序員來說，幾乎天天都和this打交道。在這些語言里，this含義非常明確，就是指向當(dāng)前的對象實(shí)例，我們用起來也是相當(dāng)?shù)姆判?。然而，到了JavaScript這個(gè)動態(tài)語言里，this的寫法沒變，但是其含義卻大大地不同了，下面用實(shí)例說明，使用瀏覽器為Firefox14.0.1.

首先，Hello World o(^▽^)o

本人從剛開始自學(xué)javascript這門靈活的編程語言到現(xiàn)在，也有一年多的時(shí)間了。

在這一年多的時(shí)間里，這門語言所帶給我的不僅是高額的工作回報(bào)，還有很多意想不到的驚喜，讓我這樣一個(gè)藝術(shù)生領(lǐng)略編程的魅力。

從今天開始，準(zhǔn)備每周一更我的博客，不止是分享，更是勉勵(lì)自己。

OK，我們進(jìn)入今天的主題，今天我們來談?wù)刯avascript里面一個(gè)比較特殊的對象：this

接觸過其他面向?qū)ο蟮木幊陶Z言（如：java，C，C++等）的小伙伴們可能對this非常熟悉。

不過它在javascript當(dāng)中為什么會經(jīng)常性的給我們造成很多麻煩呢？

我們先來說說他與其他編程語言的不同

在javascript里面，this是一個(gè)特殊的對象，它不像其他編程語言那樣，是存儲在實(shí)例中的值，直接指向此實(shí)例。

而是作為一個(gè)單獨(dú)的指針，在不同的情況之下，指向不同的位置，這也是為什么我們會將它搞混的原因。

下面我們來看下，它在不同情況下分別是怎樣一種形態(tài)

 1.在全局作用域時(shí)：

這個(gè)是最好理解的，即在全局作用域下this指向window，也就是在全局作用域下，this與window是等價(jià)的：

console.log(this === window); //true

 另外，由于在此時(shí)，this等價(jià)于window，所以我們在全局作用域聲明的變量也會指向this：

var x = 1;
console.log(this.x);//1
console.log(window.x);//1

當(dāng)然，我們還有另一種聲明變量的方法：

x = 0;
function setNum(){
x = 1;
};
console.log(this.x);//0
setNum();
console.log(this.x);//1

當(dāng)聲明變量時(shí)不使用 var 或者 let的話 此時(shí)相當(dāng)于給全局的this添加或者改變屬性值

看起來還是很簡單的，不就是個(gè)等價(jià)于window的對象么。

當(dāng)然，如果僅僅是這樣，this或許根本就沒有存在的必要了。

而this最讓人頭疼的部分就是它在不同的作用域下，它的形態(tài)也是截然不同的

 2.當(dāng)在函數(shù)中時(shí)：

 到這里時(shí)，this的陷阱已經(jīng)漸漸顯露出來了

 這里為什么說是當(dāng)在函數(shù)中而不是局部作用域時(shí)，要講這個(gè)，首先我們要清楚function是什么

在javascript中，function作為js中的一個(gè)特殊對象：函數(shù)，是有著不同的形態(tài)的

我們通?？吹降模?br />

function set(){
  var x = 0;
};

在這一形態(tài)下，其內(nèi)部的this是與全局作用域時(shí)一樣，直接指向window，所以其形態(tài) 依然等價(jià)于window。

var x = 0;
function num(){
  this.x = 1;
}
console.log(this.x);//0
num();
console.log(this.x);//1

 這里就是經(jīng)常容易犯得錯(cuò)誤，很多人覺得，當(dāng)this已經(jīng)在一個(gè)function之中時(shí)，其目前所處位置為當(dāng)前的局部作用域，所以目前指向的應(yīng)該是此函數(shù) 

但是，如果你將這個(gè)函數(shù)實(shí)例化（new）之后，此函數(shù)將生成一個(gè)全新的環(huán)境，此時(shí)在此實(shí)例中的this也會隨之發(fā)生變化，它將指向所在實(shí)例。

num = "0";
function setThis(){
  this.num = "1";
}
console.log(this.num);//"0"
new setThis();
console.log(this.num);//"0"
console.log(new setThis().num);//1

這是因?yàn)?，?dāng)實(shí)例化之后，此函數(shù)變成了一個(gè)實(shí)例對象，而其內(nèi)部的this也自然而然的指向了此實(shí)例對象，如同一開始的this是指向window的對象一樣指向了它所在的實(shí)例

另外，在我們寫javascript的時(shí)候，我們通常還會有一種調(diào)用函數(shù)的方法，即為元素綁定事件，比如button.addEventListener(‘click', fn, false)等，如果在fn里面需要使用到this的話，那么此時(shí)this指向事件處理元素，也就是button

注意：this作為關(guān)鍵字，你是無法復(fù)寫它的。

不知不覺，寫的也好多了，其實(shí)this還有更多的形態(tài)，比如prototype，比如在html中，比如在dom事件處理程序里，由于篇幅過長，這里就不再繼續(xù)進(jìn)行敖述，下回我會講到在prototype中的this

this在我的理解中作為一個(gè)指針，相應(yīng)的它在prototype原型鏈中會有更重要的地位，不過不在我們今天的范圍之內(nèi)，暫不做過多的解釋

以后基本會每周一更吧，作為javascript的新手，也希望寫的東西可以跟更多人分享，更希望從大家的思想中總結(jié)更多的經(jīng)驗(yàn)！

關(guān)于JavaScript中的this到底是什么(一)，每周一都會給大家更新的，作為javascript的新手，希望寫的東西可以和身邊的朋友分享，更希望互相交流學(xué)習(xí)經(jīng)驗(yàn)。謝謝！

最新評論