this(全局this和局部this)
要点:
- this是函数运行时动态生成的对象
- this只能在函数内部使用
- this指的是调用函数的那个对象
- 闭包的this指向window(不是绝对的,要看调用方式)
- DOM元素执行绑定事件时,事件内部this为该DOM元素
关于要点3和4,我们可以得知this可分为全局this和局部this
为什么有全局this和局部this?
调用方式不同导致的
调用方式可分为三种:
1. 直接以函数形式调用
2. 以全局对象的方法形式调用
3. 借助call或者apply函数调用
直接以函数形式调用
//全局中this为window对象 console.log(this); //函数内this指向window var x = 1; function test(){ console.log(this); console.log(this.x); } function changeX(){ this.x=5; } changeX(); test();//window 5 //函数内部函数N次嵌套this还是指向window var x = 1; var s=function test(){ console.log(this.x); inner(); function inner(){ console.log(this.x); innerInner(); function innerInner(){ console.log(this); console.log(this.x); } } } s();//1 1 window 1
var x = 1; var s=function test(){ var x=3; console.log(x); console.log(this.x); } s();//3 1
以全局对象的方法形式调用
//构造函数中的this指向对象本身 var x = 1; function test(){ console.log(this); this.x=2; } var o=new test(); console.log(o.x); console.log(x);//test{} 2 1
//闭包中的this指向window var x = 1; function test(){ console.log(this.x); console.log(this); this.x=2; var m=function (){ this.x=4; console.log(this); console.log(this.x); console.log("m"); } return m; } test(); var o=new test(); console.log(o.x); o(); console.log("x:"+x);//1 underfined 4 m x:4
//在对象中的this,this变化后的值变化 function test(){ console.log(this); console.log(this.x); } test(); var o = {}; o.x = 1; o.m = test; o.m();//这里才是执行 o
//window 4 test 1 //这个4是window早就有的,并不是执行这代码就有的
借助call或者apply函数调用(与【以全局对象的方法形式调用】一样 ,就是写法不一样)
//apply动态指定this var x = 0; function test(){ console.log(this); console.log(this.x); } test(); var o={ x:1, m:this.test }; o.m.apply(o);
//window 0 test 1