前言
this 出现在函数中,代表函数的执行上下文对象 .
this 关键字
this 关键字只能在函数内部使用。
function func(){ consogle.log(this); }
随着函数使用场合的不同, this 的值会发生变化。但是有一个总的原则,那就是 this 永远指向调用函数的那个对象。
场景一:直接调用的全局函数中
在直接调用的全局函数中使用 this , this 代表全局对象 window 。
function func() { this.x = 100 ; //x属性被添加在window对象身上 console.log(this.x);//100 } func();//调用全局函数 ,内部的this是window对象
var x = 100;//x是全局变量,x默认成为window对象的属性 function func() { console.log(this.x);//100 } func();//调用全局函数,内部的this是window对象
var x = 100;//x是全局变量,x默认成为window对象的属性 function func() { this.x = 0; } func();//调用全局函数,内部的this是window对象 console.log(x);//输出 0 ,修改全局变量x成功
脚本中的全局变量、全局函数默认自动成为全局对象 window 的属性、方法。
场景二:特定对象的方法中
特定对象的方法中, this 就是这个对象。
function func() { console.log(this.x); } var obj = { x:100 }; obj.run = func; obj.run(); //调用特定对象的方法,内部的this就是这个对象
场景三:在定时器的事件处理函数中
在定时器的事件处理函数中, this 代表全局对象 window 。
setTimeout(function () { console.log(this); //这里的 this代表全局对象window })
场景四:数组中索引的函数中
数组中索引的函数中, this 代表数组对象
function func() { console.log(this); } var arr = [100,200,func]; arr[2]() ;// 调用数组中索引的函数,内部this 代表数组对象。
下面这种方式调用,就另当别论了。
function func() { console.log(this); } var arr = [100,200,func]; var f = arr[2]; f() ; //从数组中取出元素,全局调用,内部的this是window对象(符合场景一)
场景五: call 或 apply 调用
call() , apply() 都是函数对象的方法。它的作用是改变函数的执行上下文 ( 也就是改变函数内部的 this 指向 ) 。
call() , apply() 的第一个参数是哪个对象,函数内部 this 就指向哪个对象。
var x = 0; var obj1 = { x: 100}; var obj2 = { x: 200}; function func() { console.log(this.x); } func.call(); //0 ,此次调用func,内部this还是window func.call(obj1);//100 ,此次调用func,内部this是obj1 func.call(obj2);//200 ,此次调用func,内部this是obj2
注意:函数内部的 this 指向哪个对象是由 函数调用决定的,并非函数定义。换句话说,只有在函数执行过程中, this 才是确定的,才是有意义的。