Javascript的this用法总结

this是Javascript语言的一个关键字。

它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。比如，

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

随着函数使用场合的不同，this的值会发生变化。但是有一个总的原则，那就是this指的是，调用函数的那个对象。

下面分四种情况，详细讨论this的用法。

情况一：纯粹的函数调用

这是函数的最通常用法，属于全局性调用，因此this就代表全局对象Global。

请看下面这段代码，它的运行结果是1。

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

为了证明this就是全局对象，我对代码做一些改变：

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

运行结果还是1。再变一下：

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

情况二：作为对象方法的调用

函数还可以作为某个对象的方法调用，这时this就指这个上级对象。

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

情况三作为构造函数调用

所谓构造函数，就是通过这个函数生成一个新对象（object）。这时，this就指这个新对象。

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

运行结果为1。为了表明这时this不是全局对象，我对代码做一些改变：

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

运行结果为2，表明全局变量x的值根本没变。

情况四 apply调用

apply()是函数对象的一个方法，它的作用是改变函数的调用对象，它的第一个参数就表示改变后的调用这个函数的对象。因此，this指的就是这第一个参数。

　　var x = 0;
　　function test(){
　　　　alert(this.x);
　　}
　　var o={};
　　o.x = 1;
　　o.m = test;
　　o.m.apply(); //0

apply()的参数为空时，默认调用全局对象。因此，这时的运行结果为0，证明this指的是全局对象。

如果把最后一行代码修改为

　　o.m.apply(o); //1

运行结果就变成了1，证明了这时this代表的是对象o。

（完）

另外介绍：

javascript 中this 的用法:
1.<div
onclick="// 可以在里面使用this">division
element</div> this 指向div
2.    <div id="elmtDiv">division
element</div>
       <script
language="javascript">
        var div =
document.getElementById('elmtDiv');
        div.attachEvent('onclick',
EventHandler); //attachEvent把div的onclick事件和一个方法绑定

JSClass.prototype.ToString = function()
{
alert(myName + ',
' + this.m_Name);
};

var jc = new JSClass();

jc.ToString();//这是JavaScript模拟类定义中对this的使用，这个和其它的OO语言中的情况非常的相识。但是这里要求成员属性和方法必须使用this关键字来引用，运行上面的程序会被告知myName未定义。
5、为脚本引擎内部对象添加原形方法中的this关键字：
Function.prototype.GetName
= function()
{
      var fnName = this.toString();
      fnName =
fnName.substr(0, fnName.indexOf('('));
      fnName =
fnName.replace(/^function/, '');
      return
fnName.replace(/(^\s+)|(\s+$)/g, '');
}
function foo(){}

alert(foo.GetName());    //这里的this指代的是被添加原形的类的实例，和4中类定义有些相似，没有什么太特别的地方。

6、结合2&4，说一个比较迷惑的this关键字使用：

view plain copy to clipboard print ?

function JSClass()
{
this.m_Text = 'division element';
this.m_Element = document.createElement('DIV');
this.m_Element.innerHTML = this.m_Text;
this.m_Element.attachEvent('onclick', this.ToString);
}
JSClass.prototype.Render = function()
{
document.body.appendChild(this.m_Element);
}
JSClass.prototype.ToString = function()
{
alert(this.m_Text);
};
var jc = new JSClass();
jc.Render();
jc.ToString();

我就说说结果，页面运行后会显示："division element"，确定后点击文字"division element"，将会显示："undefined"。

7、CSS的expression表达式中使用this关键字：

<table width="100" height="100">
<tr>
<td>
<div style="width: expression(this.parentElement.width);
height: expression(this.parentElement.height);">
division element</div>
</td>
</tr>
</table>

这里的this看作和1中的一样就可以了，它也是指代div元素对象实例本身。

8、函数中的内部函数中使用this关键字：

view plain copy to clipboard print ?

function OuterFoo()
{
this.Name = 'Outer Name';
function InnerFoo()
{
var Name = 'Inner Name';
alert(Name + ', ' + this.Name);
}
return InnerFoo;
}
OuterFoo()();

运行结果显示是："Inner Name, Outer Name"。按我们在2中的讲解，这里的结果如果是"Inner Name, undefined"似乎更合理些吧？但是正确的结果确实是前者，这是由于JavaScript变量作用域的问题决定的，详细了解推荐参看"原来JScript中的关键字'var'还是有文章的"一文及回复。

来源：http://blog.csdn.net/xiaoyuemian/article/details/3842184

    归纳起来，JavaScript中的this用法有以下3种（详细用法参原文）：
    1.在HTML元素事件属性或 CSS的expression表达式中inline方式使用this关键字——对应原文的1、7
       2.在事件处理函数中使用this关键字——对应原文的2、3
         其中可分为两种方式
      (1)DOM方式——此种方式的结果是this指向窗口（window）对象
      (2)DHTML方式——此种方式的结果是this指向div元素对象实例
    3.在类定义中使用this关键字并在其内部函数或成员函数（主要是prototype产生）中使用——对应原文的4、5、8