js函数中this的指向
函数在执行时内部会默认创建一个对象叫this,以不同的方式调用函数,内部的this指向是不一样的,this的指向在函数定义的时候是不能确定的,只有调用执行了函数以后才能确定this到底指向谁。谁直接调用了产生this的函数,this就指向谁。
函数的调用方式大概有6种,所以this的指向也可以大致按照这6种来区分。
- 函数名+小括号直接调用函数,this指向全局对象window。
因为以函数名加小括号的方式调用函数时相当于是window通过.调用了该函数,所以此时this指向window。 - 通过对象点来调用对象的某个函数,this指向调用这个函数的对象。
举个例子就是,有一个对象obj,在这个对象内部有一个键值对,这个键值对的值是一个函数,那么通过obj.这个键可以调用这个函数,此时函数内部this指向的就是对象obj。 - 当函数被当做事件处理函数时,this指向触发事件的元素。
- IIFE:this指向window。
- 构造函数中this指向new出来的新对象。
在构造函数中使用new操作符的时候,js会先创建一个新的空对象,然后,执行这个函数,把函数中的执行对象赋给这个新生成的实例,也就是这个函数可以使用this来初始化这个新创建的对象的属性。最后返回这个新生成的对象。所以当使用new操作符之后,函数中的this指向的是新创建的对象。所以构造函数中的this就是指向new出来的那个对象。 - 定时器的回调函数中this指向window。
以setTimeout为例,setTimeout属于宏任务,它的回调在延时之后才进入到主线程执行,而函数执行的时候才会明确this的指向。执行的时候由于没有设置内部this的指向,相当于是普通函数调用,所以默认指向window。
总结
谁直接调用产生this的函数,this就指向谁。但是在使用了new操作符以后,构造函数内部的this指向的是新对象,也就是指向new出来的新实例。
改变this指向有3个方法:
- call() 调用时,传入的第一个参数用来指定函数内部this指向,后面的所有参数是函数执行时需要的实参(实参必须列举出来)。
- apply() 调用时,第一个参数和call一样,用来指定函数内部this的指向,第二个参数是一个数组或伪数组(比如arguments对象),数组元素是函数执行时需要的所有实参。
- bind() 只有一个参数,用来指定函数内部this的指向,但是会返回一个新的函数。
call和apply是一次性改变this,bind是永久性改变this