JavaScript中this的使用方法总结
JavaScript中this的使用方法总结
在JavaScript中,this的使用分为四种场景,具体请参考阮一峰老师关于this的讲解
第一种情况是纯函数使用
var x =1 ; function test(){ console.log(this.x) } test() //1
这里的输出是1,因为在函数中属于全局性的调用,因此this指代window,代表全局对象
第二种情况是作为对象方法调用
function test(){ console.log(this.x) } var obj={}//申明一个对象 obj.x = 1;//给对象设置一个属性x并赋值为1 obj.m=test;//给对象设置一个方法test obj.m();//执行对象方法,输出的是1
以上代码相当于
var obj = { x : 1, m : function () { console.log(this.x)//this指代的是obj这个对象 } } obj.m()
从上面代码可以看出,当this作为对象方法调用的时候,this指代的这个上级对象
第三种情况是作为构造函数使用
function test(){ //创建一个构造函数 this.x=1 //构造函数的属性x的值为1 } var obj = new test();//实例化构造函数生成一个新的对象,这个对象拥有一个属性x,且值为1 console.log(obj.x) //1
在上面的代码示例中,this指代的就是obj这个新的对象
第四种情况是apply调用
apply()是函数的一个方法,作用是改变函数的调用对象。它的第一个参数就表示改变后的调用这个函数的对象,将代替function类里面的this对象。因此,这时this指的就是这第一个参数
var x = 0; function test() { console.log(this.x); } var obj = {}; obj.x = 1; obj.m = test; obj.m.apply() // 0
apply()的参数为空时,默认调用全局对象。因此,这时的运行结果为0,证明this指的是全局对象。
如果把最后一行代码修改为
obj.m.apply(obj); //1
运行结果就变成了1,证明了这时this代表的是对象obj。