js中this用法

• 第一种 全局函数

                  function A() {
                    console.log(this)
                   }
                 A();//Window

此时this代表一个全局变量

• 第二种用法对象方法
  作为对象方法调用时，this指向调用该方法的对象

          var b = {
           getThis:function(){
           console.log(this)
           }
        }
       b.getThis()//b

这个例子和前一个例子不一样，运行c.getFunc()时，首先返回的是一个匿名函数，我们将这个函数赋值给cFun，接着在全局环境中调用了cFun()，所以此时this指向的还是Window。

    var c = {
              getFunc:function(){
              return function(){
              console.log(this)
           }
       }
   }
    var cFun = c.getFunc()
       cFun()//Window

下面的例子定义了一个局部变量将this赋值为that，此时this指向c

           var c = {
            getFunc:function(){
            var that = this //在这里保留住this
            return function(){
           console.log(that)
         }
      }
    }
        var cFun = c.getFunc()
           cFun()//c

• 第三种 call和apply
  this对象通常指向函数中指定的this值
  指定一个对象o1去调用其他对象o2的方法，此时this对象指向o1

   var d = {
    getThis:function(){
     console.log(this)
    }
  }
  var e ={
  }
  d.getThis.call(e)//e

  var d = {
   getThis:function(){
    console.log(this)
   }
  }
   d.getThis.call(null)//Window
   d.getThis.call(undefined)//Window

• 第四种 箭头函数
  es6中的箭头函数现在也用的比较频繁，但是有个需要注意的点是 函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。其实出现这种情况的根本原因是:箭头函数没有this对象，所以箭头函数的this就是外层代码的this

   var f = {
    getThis:()=>{
     console.log(this)
    }
   }
   f.getThis()//Window

   var g = {
   getThis:function(){
    return function(){console.log(this)}
   }
   }
   var h = {
   getThis:function(){
    return ()=> console.log(this)
   }
   }
   g.getThis()()//Window
   h.getThis()()//h

由于函数在全局环境中运行，所以此时this指向Window；h的getThis使用了箭头函数，所以this指向了外层代码块的this所以，此时this指向的是h。

总结
一般情况下this对象指向调用函数的对象，全局环境中执行函数this对象指向Window
在call和apply函数中this指向指定的对象，如果指定的对为undefined或者null，那么this对象指向Window
在箭头函数中，this对象等同于外层代码块的this
文章参考[脚本之家]（https://www.jb51.net/article/132185.htm）