深入理解JS函数中this指针的指向

 

函数在执行时，会在函数体内部自动生成一个this指针。谁直接调用产生这个this指针的函数，this就指向谁。

怎么理解指向呢，我认为指向就是等于。例如直接在js中输入下面的等式：

console.log(this===window);//true

情况不同，this指向的对象也不同。例如：

1.  函数声明的情况

var bj=10;
function add(){
    var bj=20;
    console.log(this);//window
    console.log(this.bj);//10
    console.log(bj);//20
    console.log(this.bj+bj);//30
}
add();
window.add();

（1） 执行了add（）之后，此时的this指向的是window对象，为什么呢？因为这时候add是全局函数，是通过window直接调用的。所以下面我专门写了个window.add()就是为了说明，全局函数的this都是指向的window。

（2） 就像alert（）自带的警告弹窗一样,window.alert（）执行之后也是一样的效果。所以只要是   window点   这种调用方式都可以省略掉，因此警告弹窗可以直接使用alert（）。

2.  函数表达式

var bj=10;
var zjj=function(){
    var bj=30;
    console.log(this);//window
    console.log(this.bj);//10
    console.log(bj);//30
    console.log(this.bj+bj);//40
}
console.log(typeof zjj);//function
zjj();
window.zjj();

（1） 执行了zjj（）之后，函数中的this也是指向window对象。原因和第一个是一样的，都是通过window这个对象直接调用。

3.  函数作为对象的属性去调用------例一

var bj=10;
var obj={
    name:"八戒",
    age:"500",
    say:function(){
        var bj=40;
        console.log(this);//就是obj这个对象
        console.log(this.bj);//undefined
        console.log(this.name);//八戒
    }
}
obj.say();
window.obj.say();

（1） 当obj.say（）被执行的时候，此时的this指向的是 obj 这个对象，为什么呢？因为say函数是通过obj这个对象直接调用的。

（2） 那有人可能会问了，obj对象实际上也是通过window对象调用的，为什么this不指向window呢？我认为是因为say这个函数是通过 obj 对象直接调用的，而没有通过 window 对象直接调用，因此this不会指向window。

4.  工厂模式中this的指向------例一

var bj=10;
function fun(a,b){
　　 console.log(this);//window对象
    var bj=20;
    var sun=new Object();
    sun.one=a;
    sun.two=b;
    sun.say=function(){
        console.log(this);//是sun对象，{one: 2, two: 3, say: ƒ()}
        console.log(this.bj);//undefined
        console.log(this.one);//2
    }
    return sun;
}
var wk=fun(2,3);
wk.say();

　　

（1） 话说为什么叫工厂模式，我搞不太清楚，不过这个不重要，重要的是通过这个模式，在每次调用函数的时候，虽然每次都返回的是sun这个对象，但是每个对象都是不相似的，即使内容一样，比如 var sf=fun(2,3); console.log(sf===wk);//false 。

（2） 那为什么say（）函数执行之后，this是指向返回的那个对象呢？这个很明显嘛，say（）是通过wk这个对象直接调用的，而wk是fun函数返回sun对象。所以这里的this就指向的是返回的对象。所以this.bj为undefined，因为返回的对象中没有bj属性。

（3） 我认为这种模式最重要的还是 renturn sun这个返回语句，这个是必不可少的。

（4） fun(a,b)这个函数中的this指向的是window，原因是执行 var wk=fun(2,3); 的时候，fun函数已经被执行了，并且直接调用它的就是window，所以这时的this是指向的window。