Javascript笔记之 函数中的this

这个很有搞头，简单看两个例子，说说我个人的理解吧：

 

例一.

 

var aa=11; 
Test(); 
alert(aa);

function Test() 
{ 
　　var aa=33; 
　　alert(this.aa);
　　this.aa = 22; 
　　alert(this.aa);
　　alert(aa);
} 

alert(new Test().aa);

 

这段代码运行结果是：

[11] [22] [33] [22] [undefined] [22] [33] [22]

 

一点个人理解：

• 这段带码运行在window对象上，浏览器似乎将var定义的变量全部当成window对象的属性，若一个变量未用var定义，却在程序中被赋值，那么浏览器将先为window对象创建该属性，并给该属性赋值；

• 任何函数中的this代表调用该函数的对象，如果没有任何对象调用该函数（直接让函数执行），那么就相当于是window对象调用该函数执行（其中的this就代表window对象）；

• 对于new Test()这样的写法其实可以看做新建一个空对象，然后让该空对象调用Test()函数；在悟透javascript一书中李占说：var aObj = new func()就等价于 var aObj = {}; func.call(aObj);

代码第一次调用Test()时，this对应的对象是window，第二次this对应的对象是一个匿名的Object。

 

 

例二.

 

var Foo = {Name:'Foo'};

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

(new OuterFoo())();               // 直接调用InnerFoo, 但是为OutFoo创建了调用对象
alert(window.Name);             // 由于OutFoo有了调用对象, 故而不会为window对象创建Name属性
OuterFoo()();                         // 直接调用InnerFoo, 并且也直接调用了OutFoo
alert(window.Name);            // 由于直接调用了OutFoo, 所以也为window对象创建Name属性并赋值
(new OuterFoo()).call(Foo);  // 用Foo对象调用InnerFoo, InnerFoo当然也就获得了其Name属性

 

这段代码运行结果是：

[Inner Name, undefined] [undefined] [Inner Name, Outer Name] [Outer Name] [Inner Name, Foo]

 

简单分析见注释部分。

 

总而言之，function中的this指向调用它的对象， 默认的调用它的对象为window。

呵呵，刚刚看到其他的帖子这样描述this：有奶就是娘，很贴切啊！

还有其他的一些常见的讨论，见下面的讨论贴：

http://www.iteye.com/topic/189102

http://www.iteye.com/topic/122569