本文實例講述了JavaScript中的this基本問題.分享給大家供大家參考，具體如下：

目前成都創(chuàng)新互聯(lián)已為上千多家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)絡(luò)空間、網(wǎng)站托管、服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計、盂縣網(wǎng)站維護等服務(wù)，公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

在函數(shù)中 this 到底取何值，是在函數(shù)真正被調(diào)用執(zhí)行的時候確定下來的，函數(shù)定義的時候確定不了。

執(zhí)行上下文環(huán)境 ：

 **定義**：執(zhí)行函數(shù)的時候，會產(chǎn)生一個上下文的對象，里面保存變量，函數(shù)聲明和this。

 **作用**：用來保存本次運行時所需要的數(shù)據(jù)

當(dāng)你在代碼中使用了 this，這個 this 的值就直接從執(zhí)行的上下文中獲取了，而不會從作用域鏈中搜尋。

關(guān)于 this 的取值，大體上可以分為以下幾種情況：

情況一：全局 & 調(diào)用普通函數(shù)

在全局環(huán)境中，this 永遠(yuǎn)指向 window。

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

普通函數(shù)在調(diào)用時候(注意不是構(gòu)造函數(shù)，前面不加 new)，其中的 this 也是指向 window。

但是如果在嚴(yán)格模式下調(diào)用的話會報錯：

var x = 1;
function first(){
  console.log(this);   // undefined
  console.log(this.x);  // Uncaught TypeError: Cannot read property 'x' of undefined
}
first();

情況二：構(gòu)造函數(shù)

所謂的構(gòu)造函數(shù)就是由一個函數(shù) new 出來的對象，一般構(gòu)造函數(shù)的函數(shù)名首字母大寫，例如像 Object，F(xiàn)unction，Array 這些都屬于構(gòu)造函數(shù)。

function First(){
  this.x = 1;
  console.log(this);  //First {x:1}
}
var first = new First();
console.log(first.x);   //1

上述代碼，如果函數(shù)作為構(gòu)造函數(shù)使用，那么其中的 this 就代表它即將 new 出來的對象。

但是如果直接調(diào)用 First函數(shù)，而不是 new First()，那就變成情況1，這時候 First() 就變成普通函數(shù)。

function First(){
  this.x =1;
  console.log(this);  //Window
}
var first = First();
console.log(first.x);   //undefined

情況三：對象方法

如果函數(shù)作為對象的方法時，方法中的 this 指向該對象。

var obj = {
  x: 1,
  first: function () {
    console.log(this);    //Object
    console.log(this.x);   //1
  }
};
obj.first();

注意：若是在對象方法中定義函數(shù)，那么情況就不同了。

var obj = {
  x: 1,
  first: function () {
    function second(){
      console.log(this);   //Window
      console.log(this.x);  //undefined
    }
    second();
  }
}
obj.first();

可以這么理解：函數(shù) second雖然是在 obj.first 內(nèi)部定義的，但它仍然屬于一個普通函數(shù)，this 仍指向 window。

在這里，如果想要調(diào)用上層作用域中的變量 obj.x，可以使用 self 緩存外部 this 變量。

var obj = {
  x:1,
  first: function () {
    var self = this;
    function second(){
      console.log(self);   //{x: 1}
      console.log(self.x);  //1
    }
    second();
  }
}
obj.first();

如果 first 函數(shù)不作為對象方法被調(diào)用：

var obj = {
  x: 1,
  first: function () {
    console.log(this);    //Window
    console.log(this.x);   //undefined
  }
};
var fn = obj.first;
fn();

obj.first 被賦值給一個全局變量，并沒有作為 obj 的一個屬性被調(diào)用，那么此時 this 的值是 window。

情況四：構(gòu)造函數(shù) prototype 屬性

function First(){
  this.x = 1;
}
First.prototype.getX = function () {
  console.log(this);    //First {x: 1, getX: function}
  console.log(this.x);   //1
}
var first= new First();
first.getX();

在 First.prototype.getX 函數(shù)中，this 指向的first 對象。不僅僅如此，即便是在整個原型鏈中，this 代表的也是當(dāng)前對象的值。

情況五：函數(shù)用 call

var obj = {
  x:1
}
function first(){
  console.log(this);   //{x: 1}
  console.log(this.x);  //1
}
first.call(obj);

當(dāng)一個函數(shù)被 call調(diào)用時，this 的值就取傳入的對象的值。

來源：知乎

鏈接：https://zhuanlan.zhihu.com/p/25294187?utm_source=com.youdao.note&utm_medium=social

感興趣的朋友可以使用在線HTML/CSS/JavaScript前端代碼調(diào)試運行工具：http://tools.jb51.net/code/WebCodeRun測試上述代碼運行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容還可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

本文題目：JavaScript中的this基本問題實例小結(jié)
路徑分享：http://www.rwnh.cn/article32/pgchpc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計公司、手機網(wǎng)站建設(shè)、網(wǎng)站收錄、網(wǎng)站維護、品牌網(wǎng)站設(shè)計、網(wǎng)站內(nèi)鏈

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)