在JavaScript被调用的时候,除了可见的行参被传入方法体之外,this也被隐形地传进去了。所以,从这点也再次说明JavaScript的this的值完全取决于函数被调用时候的上下文,而不是像java的this是在声明的时候确定的。
JavaScript里,this的值随着一个函数被调用情况的不同而不同。而一个函数有4种被调用的情况,也就是说this的值有4种,那先来看看有哪四种调用函数的方法:
1: 作为方法被调用
当一个函数被赋给一个对象的属性,并引用该属性进行调用时,this === the object
var func = function(){
return this.a;
}
var obj = {
a: 10,
name: 'hehe',
fn: func
}
this.a = 20;
obj.fn();//10
当我们执行到func时,在右边的调试工具栏可以看到this是我们的obj这个对象。
2: 作为一个函数被调用
只最常用的用()进行调用的情况,这时候this === Window
先来看一段代码:
var func = function(){
var a = 10;
return this.a;
}
var a = 20;
func();//结果是20而不是10
当我们执行到func时,这时候的this是全局对象Window,那this.a自然就是全局变量a(20),而不是定义在func内部的a(10)。
其实第二种情况是第一种情况的特例,这里的对象是全局对象Window,这个方法是在Window上调用的,那this自然也就是Window了。
3: 作为构造函数被调用
指用new关键字进行调用生成一个对象实例子的情况,这时候this === 生成的实例对象
function Fruit(){
this.func = function(){return this}
}
var apple = new Fruit();
var orange = new Fruit();
apple.func() === apple; //true
orange.func() === orange; // ture
在我们用new调用一个构造函数时,发生了三件事:
1: 创建了一个新的空对象。
2: 在第一步创建的这个空对象作为this传给这个构造函数。 (每一个函数被调用时,都隐式地传入一个this)
3: 如果没有显示的返回值,新创建的这个对象,就会作为构造器函数的返回值进行返回。
第三点解释了为什么我们可以在apple上调用func这个方法,第二点解释了为什么appl.func()的执行结果等于apple.
4: 使用apply()和call()方法进行调用
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。