javascript中this指向问题
本文参考http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html
this是JavaScript的一个关键字,它代表函数运行时自动生成的一个内部对象,只能在函数内部使用,比如:
function test () { this.x = 1; }
随着函数使用场合的不同,this的指向会发生变化。但有一个总的原则就是,this指向最后一个调用函数的那个对象。
下面分四种情况,讨论一下this的用法;
情况一:纯粹的函数调用
这是函数通常用法,属于全局性调用,this指向全局对象;
下面这段代码运行结果为1:
function test () { this.x = 1; alert(this.x); } test(); // 1
此处运行结果为1,我开始以为当前的this指向的是函数本身,其实指向的是全局对象
代码做下面处理:
var x = 1; function test () { alert(this.x) } test(); // 1
全局中定义一个x变量,在函数内部使用this.x结果是1;
再变一下:
var x = 1; function test () { this.x = 2; alert(this.x) } test(); // 2
全局变量x的值在函数内部被改变。
情况二:作为对象方法的调用
函数还可以作为某个对象方法的调用,这时this指向的就是引用它的对象;
function test () { alert(this.x) } var o = {}; o.x = 1; o.m = test; o.m(); // 1
情况三:作为构造函数调用
所谓构造函数,就是通过这个函数生成一个对象,这时this就是指向这个新对象;
function test () { this.x = 1; } var o = new test(); console.log(o); // {x: 1} alert(o.x); // 1
还是跟上面一样,我在函数内部改变一下全局变量的值,看是否能够成功:
var x = 1; function test () { this.x = 2; } var o = new test(); alert(o.x); // 2 alert(this.x); // 1
从上面代码可以看到构造函数中的this只指向生成的对象,无法改变全局变量。
情况四:apply调用
apply()是函数对象的一个方法,它的作用是改变函数调用的对象,它的第一个参数就是表示调用这个函数的对象,因此this指向的就是第一个参数;
var x = 1; function test () { alert(this.x) } var o = {}; o.x = 2; o.m = test; o.m.apply(); // 1,apply()函数参数为空时默认调用全局对象,因此,此时运行的结果为1,证明this指向全局对象 o.m.apply(o); // 2,此时this指向对象o
最后用代码解释一下为什么说this指向最后调用它的对象
var a = 666; var o = { a: 1, b: { a: 2, fn: function () { console.log(this.a) } } } o.b.fn(); // 2,此时调用函数的对象是a对象中的b对象,所以运行结果为2 var test = o.b.fn; // 这只是一个赋值的过程,并没有执行 test(); // 666,此时调用test()方法的是全局对象