js 理解this指向（个人学习笔记）

this就是函数运行时自动生成的一个内部对象

　　首先必须要说的是，this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象（这句话有些问题，后面会解释为什么会有问题，虽然网上大部分的文章都是这样说的，虽然在很多情况下那样去理解不会出什么问题，但是实际上那样理解是不准确的，所以在你理解this的时候会有种琢磨不透的感觉），那么接下来我会深入的探讨这个问题。

　　为什么要学习this？如果你学过面向对象编程，那你肯定知道干什么用的，如果你没有学过，那么暂时可以不用看这篇文章，当然如果你有兴趣也可以看看，毕竟这是js中必须要掌握的东西。

　　1. （alert也是window的一个属性，也是window点出来的。）

function a(){
    var user = "追梦子";
    console.log(this.user); //undefined
    console.log(this); //Window
}
a();//像这中的都是window对象调用的，，，等同于window.a();  函数的里面指向的就是window，，，，window.user没有定义，所以是undifined

var o = {
    user:"追梦子",
    fn:function(){
        console.log(this.user);  //追梦子
    }
}
o.fn();   //fn()这个函数是o这个对象调用的，，，所以里面的this指向的是o    o.user == "追梦子”

var o = {
    user:"追梦子",
    fn:function(){
        console.log(this.user); //追梦子
    }
}
window.o.fn(); // this指向o  因为函数前面的第一个是o

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //12
        }
    }
}
o.b.fn();//等价于  window.o.b.fn()    函数真正运行是fn（）  前面第一个调用的是b，，，所以this指向的是b对象

var o = {
    a:10,
    b:{
        // a:12,
        fn:function(){
            console.log(this.a); //undefined
        }
    }
}
o.b.fn();//b

　　通过上面的例子，我们可以看到，，要确定this的指向问题，必须要看调用的时候的实际情况，我们其实可以这样，每个调用的时候，在前面都可以加上window调用，这样再去看；

　　　　　　　this的指向就是调用的时候，this指向的前面的（第一个）对象　　

　　然后我们看下面的这个例子：

var o = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //undefined
            console.log(this); //window
        }
    }
}
var j = o.b.fn;////不要看这，，，因为函数在这边是没有调用的，没有调用就是什么也没有用
j();//等价于window.j();  这样的话，我们知道这个函数执行的时候，里面的this指向的window

　　　　　　　　　　　　　　　　　　　　this永远指向的是最后调用它的对象

构造函数版this：（new可以改变this的指向）

function Fn(){
    this.user = "追梦子";
}
var a = new Fn();//this指向a
console.log(a.user); //追梦子

　　　　new运行原理是：

new Animal('cat') = {//类似这样
    var obj = {};//先定义一个空对象
    obj.__proto__ = Animal.prototype;//把 obj 的__proto__ 指向构造函数 Animal 的原型对象 prototype，此时便建立了 obj 对象的原型链：obj->Animal.prototype->Object.prototype->null

    var result = Animal.call(obj,"cat");//改变this指向，从Animal改变到obj上

return typeof result === 'object'? result : obj; //返回
}

　　　　当this碰到return时

function fn()  
{  
    this.user = '追梦子';  
    return {};  
}
var a = new fn;  
console.log(a.user); //undefined

function fn()  
{  
    this.user = '追梦子';  
    return function(){};
}
var a = new fn;  
console.log(a.user); //undefined

function fn()  
{  
    this.user = '追梦子';  
    return 1;
}
var a = new fn;  
console.log(a.user); //追梦子

function fn()  
{  
    this.user = '追梦子';  
    return undefined;
}
var a = new fn;  
console.log(a.user); //追梦子

　　　　　通过上面的例子，我们可以看到，当返回值位Object的时候，this指向是改变的，当是其他类型的时候，this指向是不会改变的，还会指向那个实例

　　　　　　　　还有一点就是虽然null也是对象，但是在这里this还是指向那个函数的实例，因为null比较特殊。（null也是Object类型）

知识点补充：

　　　　　在严格版中的默认的this不再是window，而是undefined。

秒客网

js 理解this指向（个人学习笔记）

相关文章