关于Js中的this指针指向的对象

0x00 前言

    this指针的指向问题一直是个大坑，今天无意间刷到了一篇文章，觉得说的挺好，记录一下方便复习

    链接：https://www.cnblogs.com/pssp/p/5216085.html

0x01 正文

    时刻记住，this指向调用它的对象

    function a(){
      let user = "追梦子";
      console.log(this.user); //返回undefined
      console.log(this); //返回Window 因为a（）实际是window.a()
    }
    a();

 

var o = {
    user:"追梦子",
    fn:function(){
        console.log(this.user);  // 返回追梦子，此时this指向对象o
    }
}
o.fn();

情况1：如果一个函数中有this，但是它没有被上一级的对象所调用，那么this指向的就是window，这里需要说明的是在js的严格版中this指向的不是window，但是我们这里不探讨严格版的问题，你想了解可以自行上网查找。

情况2：如果一个函数中有this，这个函数有被上一级的对象所调用，那么this指向的就是上一级的对象。

情况3：如果一个函数中有this，这个函数中包含多个对象，尽管这个函数是被最外层的对象所调用，this指向的也只是它上一级的对象

    let o = {
      a:10,
      b:{
        a:12,
        fn:function(){
          console.log(this.a); // 此时输出12，因为this指向对象b
        }
      }
    }
    o.b.fn();

    var o = {
      user:"追梦子",
      fn:function(){
        console.log(this.user); // 返回追梦子，因为此时this指向o
      }
    }
    window.o.fn(); // 注意let定义的变量不在window对象中

    let q = {
      a:10,
      b:{
        a:12,
        fn:function(){
          console.log(this.a); // 返回undefined
          console.log(this); // 此时this指向window
        }
      }
    }
    let j = q.b.fn;
    j();

在构造函数等地方，this的指向是可以自行改变的

function Fn(){
    this.user = "追梦子";
}
var a = new Fn();
console.log(a.user); // 返回追梦子
// 这里使用了new改变了this的指向，这里的a其实是一个对象，new Fn()相当于把函数Fn复制给了a，于是这里的this指向a而不是window

而当函数有返回值时，若返回值为对象，则指向那个返回的对象

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

    function fn1(){
      this.user = '追梦子';
      return {};
    }
    let b = new fn1;
    console.log(b.user); // 返回undefined