this的概念

this是JavaScript的一个关键字，他是指函数执行过程中，自动生成的一个内部对象，是指当前的对象，只在当前函数内部使用。

this对象是在运行时基于函数的执行环境绑定的：在全局函数中，this指向的是window；当函数被作为某个对象的方法调用时，this就等于那个对象。

  • 在全局环境中(非函数体内)，无论是否在严格模式，this都指向window。

    1
    2
    'use strict' //使用严格模式
    	console.log(this) //window

  • 在普通函数中，this指向window。

    1
    2
    3
    function fn() {
      console.log(this) //window
    }

  • 函数在严格模式下，this指向undefined。

    1
    2
    3
    4
    5
    6
    function fn() {
          'use strict' //使用严格模式
          console.log(this) //undefined
          console.log(this === window) //false
        }
        fn()

  • 在构造函数中，this指向创建的实例对象。

    1
    2
    3
    4
    5
    6
    7
    8
    function fn() {
          this.a = '1'
          this.b = function () {
            console.log(this) //Fn {a: '1', b: ƒ}
          }
        }
        var c = new fn()
        c.b()

  • 箭头函数没有自己的this，他的this是继承而来，也就是箭头函数上级的this。

  • 在对象中，this指向调用者

1
2
3
4
5
6
let obj = {
      fn: function () {
        console.log(this)
      },
    }
    obj.fn() //指向obj这个对象
  • 以事件绑定函数的形式调用时，this 指向绑定事件的对象

改变this指向

call/apply/bind都可以强制改变this的指向

call和apply 都是立即执行函数，并且改变函数中的this，再并且给函数传递参数

  • call执行的函数，如果有参数，则以“,”方式一个个去添加
  • apply执行的函数，如果有参数，则以数组的方式来传递
  • bind并不会把函数立即执行，它是预先处理函数中的this和参数的