笔记---this指向

this是什么

this是 执行主体（调用阶段的触发者）

以下举例说明：

张三 在有暖气的公司 写代码
写代码（正在做的事情）------ 函数
在有暖气的公司 （地点或环境）----- 执行上下文
张三 （对象） ------ 执行主体

this指向总结

关于this的指向，函数内部的this只有在函数被调用的时候，内部this的指向才会被确定到底指向谁。谁调用的函数，那么函数内部的this就指向谁。

当函数调用的方式严格模式下this指向是undefined，非严格模式下this指向是window

箭头函数中的this

箭头函数本身没有自己this，其内部this是继承于离自己最近的函数作用域中的this

案例

案例一

const obj2 = {
    foo: function (){
        function bar(){
            console.log(this) // Window 对象
        }
        bar()
    }
}

obj2.foo();

图中代码bar函数在调用时，先看谁调用的bar，图中是没有对象调用bar函数。那么在严格模式下this指向undefined 非严格模式下指向Window

案例二

var length = 10

function fn() {
    console.log(this.length)
}

const obj = {
    length: 5,
    method(fn) {
        fn() // 输出10 -----只看fn函数被谁调用
        arguments[0]() // 输出3， ---- 相当于是arguments.fn()  此时fn函数内部的this指向arguments，所以结果是3
    }
}

obj.method(fn, 1, 2)

案例三

var x = 4
var obj = { x: 2 }

obj.fn = (function () {
  // this.x 中的this指向window （原因是：函数自调用的时候，this指向window）
  this.x *= ++x  // this.x = 4 * 5  此时全局的x值变为20
  return function (y) {
  // y 是传进来的5， 此函数内部的this指向obj  原因是obj调用的这个函数
    this.x *= (++x + y)  // this.x = 2 * (21 + 5)
    console.log(x) // 此处输出的是全局的x，故而是21
  }
})()

obj.fn(5) // 输出21

this的五种情况

1. 事件绑定中的this指向绑定事件的DOM元素
2. 普通函数调用中的this，看点. 前面是谁
3. 构造函数中的this指向new 的实例
4. call apply bind 中绑定的是谁 this就指向谁
5. 箭头函数中的this就是父级作用域中的this