js中的 this

谁调用的 Wo，this 就是指向谁

this 指向 window

    function test(){
      // console.log(this)
      // console.log(window)
      console.log(this === window)  // true
    }
    test()

在 window 下执行函数 test ， this 指向 window 这个对象

this 指向 object

    let obj = {
      name: 'obj',
      test: function(){
        console.log(this)               // this 就是对象 obj
        console.log(this === obj)       // true
        console.log(this === window)    // false
      }
    }
    obj.test()

虽然是写在window下的，test执行是调用的 obj 里面的 test （也就是对象 obj 调用了 test() ），所以 Ta 指向 obj;

ES 6 箭头函数

    let obj = {
      name: 'obj',
      test: () => {
        console.log(this)               // this 指向 window
        console.log(this === obj)       // false
        console.log(this === window)    // true
      }
    }
    obj.test()

箭头函数没有 this，箭头函数中的 this 不会绑定在 obj ， 而是绑定在了执行 Ta 的区域，即：obj.test() 执行区域是在 window 下

this 指向 构造函数

    var num = 1
    function Construct(name){
      console.log(this === window)
      console.log(this.num)
    }
    Construct()         // true 1
    new Construct()     // false undefined

可以看到构造函数的 this 并不指向 window，而是指向 Construct 函数

apply 改变 this 指向

apply() 应用某一对象的一个方法，用另一个对象替换当前对象

   let obj = {
     name: 'obj',
     test: function(a) {
       console.log(this === obj)
       console.log(this === window)
     },
     test2: function(){
       this.test.apply(this, [])
     }
   }
   obj.test.apply(this, [])    // false true   obj.test 函数中的 this 为 window
   obj.test2()                 // true false

如果不够直观

    let obj = {
      name: 'obj',
      test: function(a) {
        console.log(this === obj)
        console.log(this === obj2)
        console.log(this === window)
      },
      test2: function(){
        this.test.apply(this, [])
      }
    }
    let obj2 = {
      test2: function(){
        obj.test.apply(this, [])
      }
    }
    // 虽然比较“绕”，通过对比会发现 obj.test 中的 this， 如果是用 apply 传入参数，apply中的 this 是谁 obj.test 中的 this 就是会谁
    
    obj.test.apply(this, [])    // false false true
    obj.test2()                 // true false false
    obj2.test2()                // false true false