JS中 this 的指向问题
   
　　在菜鸟教程中列出了Java Script this的几种情况：
 
  •     在方法中，this 表示该方法所属的对象。
  •     如果单独使用，this 表示全局对象。
  •     在函数中，this 表示全局对象。
  •     在函数中，在严格模式下，this 是未定义的(undefined)。
  •     在事件中，this 表示接收事件的元素。
  •     类似 call() 和 apply() 方法可以将 this 引用到任何对象。

 我来简单举例几个所学到的：

1.方法调用中，this指向调用它方法所属的对象
        var x = 2;
        var obj = {
            x: 1,
            fn: function () {
            console.log(this.x)
        }
        }
        //调用方法所属的对象为obj
        obj.fn(); //1

 

2.函数调用中，this指向window,其中包括匿名函数，setTimeout，setInterval等
        var a = 33;

        function fn1() {
            var a=22;
            console.log(this.a,this)
        }
        fn1(); //33 window

 

3.箭头函数比较特殊，它的this指向上一级（宿主对象）,与其所在方法的声明位置有关

        var x=3;
        var fn2=()=>{
            var x=1;
            console.log(this.x)
        }
        var obj1={
            x:1,
            fn2:fn2
        }
        fn2();//3
        obj1.fn2();//3

 

4.构造函数中, this指向创建出来的实例

        var fn = undefined;

        function Fn() {
           fn = this; //this指向创建出来的实例化对象obj
        }
        var obj = new Fn()
        console.log(fn == obj); //ture

 

5.严格模式下，this 是未定义的(undefined)，fn是被直接调用的，并没有没有被执行环境所定义，也就是说不是作为对象的属性或方法调用

        "use strict";
        var fn3 = function () {
            return this
        }

        console.log(fn3() == undefined); //true

 

6.bind中的（）第一个参数可以改变this指向，类似 call() 和 apply() 方法可以将 this 引用到任何对象。

 

    //class中bind的使用
    class P {
      constructor() {
        this.pObj = document.createElement('p');
        this.pObj.innerHTML = '见过你的美,还能爱上谁?';

        document.body.appendChild(this.pObj);

        // 事件回调方法中的this默认指向当前节点对象(p.Obj)
        // 使用bind让其指回类的实例化对象
        
        this.pObj.addEventListener('click', this.clickFn.bind(this));
      }

      clickFn() {
        console.log(this);//指向实例化对象new p;

        this.say();
      }

      say() {
        console.log('你猜猜我能不能被调用!');

      }
    }

    new P;