js中的this指向

      在工作过程当中，我们经常会碰到有关于this这个关键字，尤其是在封装插件的时候，如果对于this的指代不理解或者一知半解，就会导致我们项目中，后续出现各种各样的问题，下面就说说我自己对于this关键字的理解

       关于this的指向，我们始终记住一句话，那就是“this的指向，在函数定义的时候是确定不了的，只有在函数调用的时候，我们才能知道this指向”；如何理解这句话呢？如下所示：

        function  A(){

             var  name="hello";

              this.age=12;

              console.log(this.age);

         };

         A(); //12;

      在上面这个例子中，函数执行完后，会打印出12；因为此时定义的函数A是在window作用域下定义的，所以在执行A的时候，我们可以理解成此时是window调用了A函数，所以在非严格状态下，此时的this指向的是window;

       再来看一个例子：

        var name="haimei"

        var  object={

            name:"lilei",

            getName:function(){

                 console.log(this.name);

           }

        };

        object.getName();//lilei;

   上述这个例子中，函数getName()被object调用的，所以在执行函数的时候，会打印出"lilei";

    我们再来看一个例子：

     var name="haimei"

        var  object={

            name:"lilei",

            people:{

                 name:"tom",

                 getName:function(){

                       console.log(this.name);

                  }

            }

        };

        object.people.getName(); //   ?

        各位看官可以想想这个时候，打印出来的会是什么？

         在上面这个例子中，最终打印出来的会是tom；

         先简单总结一下：

              1：如果在一个函数中有this,但是它没有被上一级的对象所调用，那么this指向的就是window;

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

              3：如果一个函数中有this,这个函数是被多个对象所包裹的（即：这个函数的父级是一个对象，它的父级的父级也是一个对象，依次类推，即使这个函数被父级对象的父级对象........所包裹）；在调用的时候，尽管这个函数是被最外层的对象所调用，函数中的this指向的也只是它的父级对象；

 

        二：当碰到的this在构造函数里面时的情况：

             function  Fn(){

                 this.name="瞎搞"

             }；

             var  user=new  Fn();

              console.log(user.name);    //瞎搞

              这里之所以能够通过实例化的对象来调用name属性，这是因为new  关键字改变了this的指向；此时的this指向的是实例化出来的user对象；

        三：当有this的函数中有return 关键词的时；

            function  Fn(){

                  this.name="瞎搞";

                  return  {name:"瞎说"}

             };

            var   obj=new  Fn();

            console.log(obj.name);  //瞎说;

            function  Fn(){

                  this.name="瞎搞";

                  return  {}

             };

            var   obj=new  Fn();

            console.log(obj.name);  //undefined;

            function  Fn(){

                  this.name="瞎搞";

                  return 1;

             };

            var   obj=new  Fn();

            console.log(obj.name);  //瞎搞;

            function  Fn(){

                  this.name="瞎搞";

                  return null;

             };

            var   obj=new  Fn();

            console.log(obj.name);  //瞎搞;

       在上述三个例子中，不知道各位有没有看出来什么；

              从上述例子中，我们可以明显的知道，在一个有this的函数中，如果有return 关键字，且返回的是一个对象，那么this指向的就是返回的那个对象，也行有人会说最后一个例子中，返回的是一个null，在js里面，null也是对象，那为什么最后调用name属性的时候，也会输出“瞎搞”，这里麻烦大家记住，对于返回值为null的，this也是指向通过函数实例化的那个对象；

             而如果返回的不是一个对象，而是一个非引用类型的,this指向的也是通过函数实例化出来的对象；             ，即.return的是五种简单数据类型：String，              Number，Boolean，Null，Undefined，这种情况下，忽视return值，依然返回this对象。

 

       如有错误的地方，欢迎各位指正