javascript的this多种场景用法

Posted 2020-10-14

作者：刘志祥

时间：2017.11.10

参考：阮一峰的官方网站

 

this 是javascript中的一个关键字，只能在函数内使用。随着场合的不同，this的值会发生变化。

1. 单纯的全局函数调用，此时this指向window对象

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

test2(); // 1

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

test2(); // 1

var x = 1;
function test3(){
　 this.x = 0;
}

test3();
alert(x); //0

第一个就代表window调用test1()；第二个函数证明this指向全局对象Global；第三个执行test3()后，改变了全局变量x，所以证明this指向window。

2.一个对象调用此函数

 

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

对象调用此函数，this此时指向改对象。

3. 构造函数调用

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

var o = new test();
alert(o.x); // 1

通过test() new出一个新对象后，此时this就指向这个新对象。并且此时this不是全局的，只是指向了这个新new出的对象。不会对外面有什么影响。

 

4.apply调用

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

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

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

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

apply()里面为空的话，默认全局调用此函数，this指向全局window，所以输出全局的0；

apply(o)改变了调用此方法的对象，此时this指向了o对象，输出1。