DIV CSS 佈局教程網

本文實例分析了JavaScript中this的用法。分享給大家供大家參考，具體如下：

一."this"公理

this關鍵字永遠都指向函數(方法)的所有者；

function fn1(){
  this
};
fn1(); //this=>window
oDiv.onclick=fn1; //this=>oDiv
oDiv.onclick=function(){
  this //this=>oDiv
  fn1(); //this=>window
}

<div onclick="this.fn1();"></div> //這種行間腳本的寫法現在非常罕見

這裡的this指向div，fn1()裡的this指向window

var it=
{
  info:["騰訊","搜狐","新浪","百度"],
  getinfo:function()
  {
    alert(this.info.join(","));
  }
};
it.getinfo();

輸出：騰訊,搜狐,新浪,百度

二.函數賦值給變量時的"this"問題

var it=
{
  info:["騰訊","搜狐","新浪","百度"],
  getinfo:function()
  {
    alert(this.info.join(","));
  }
};
var data=it.getinfo;
data();

輸出：報錯，TypeError: this.info is undefined

代碼相當於

var data=function(){
  alert(this.info.join(","));
};
data();

這裡的this指向window，這裡的data是被賦值，如果是var data=it.getinfo();那就是調用，結果還是騰訊,搜狐,新浪,百度。如果alert(this.it.info.join(","));結果還是騰訊,搜狐,新浪,百度。

var info=["QQ","sohu","sina","baidu"]
var it=
{
  info:["騰訊","搜狐","新浪","百度"],
  getinfo:function()
  {
    alert(this.info.join(","));
  }
};
var data=it.getinfo;
data();

輸出：QQ,sohu,sina,baidu

三.作為對象方法調用時的"this"問題

function test()
{
  alert(this.x);
}
var o={};
o.x=1;
o.t=test;
o.t();

輸出：1

四.作為構造函數調用時的"this"問題

var x=2;
function test()
{
  this.x=1;
}
test();
alert(x);

輸出：1

var x=2;
function test()
{
  this.x=1;
}
var o=new test();
alert(o.x);
alert(x);

輸出：1,2

五.閉包中的"this"指向問題

var it=
{
  info:["騰訊","搜狐","新浪","百度"],
  getinfo:function()
  {
  function abc(){
    　　alert(this.info.join(","));
  }
  abc();
  }
};
it.getinfo();

輸出：報錯，TypeError: this.info is undefined

閉包中的this不能指向it

解決方法

var it=
{
  info:["騰訊","搜狐","新浪","百度"],
  getinfo:function()
  {
  var _this=this;
  function abc(){
      alert(_this.info.join(","));
  }
  abc();
  }
};
it.getinfo();

優點：無論外部函數名字(it)怎麼變，都能指向info

更多關於JavaScript相關內容可查看本站專題：《javascript面向對象入門教程》、《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》

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