一、this指向
1、我们最大的作用域是window,所以在我们的全局中this指向window
2、在函数中(普通函数),this永远指向调用他的那个对象
3、在箭头函数中,箭头函数中没有this,使用的this就是箭头函数父级的this。
4、在构造函数中,this指向构造出来的实例。
注意:箭头函数种的this无法改变
二、改变this指向
1、apply
2、call
3、bind
this指向
在浏览器里,在全局范围内this 指向window对象;
在函数中,this永远指向最后调用他的那个对象;
构造函数中,this指向new出来的那个新的对象;
- call、apply、bind中的this被强绑定在指定的那个对象上;
- 箭头函数中this比较特殊,箭头函数this为父作用域的this,不是调用时的this.要知道前四种方式,都是调用时确定,也就是动态的,而箭头函数的this指向是静态的,声明的时候就确定了下来;
- apply、call、bind都是js给函数内置的一些API,调用他们可以为函数指定this的执行,同时也可以传参
call和apply的区别
apply()
apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组。其中,第二个参数可以是 Array
的实例,也可以是arguments 对象。
call()
call()方法与
apply()方法的作用相同,它们的唯一区别在于接收参数的方式不同。在使用call()方法时,传递给函数的参数必须逐个列举出来。
bind方法
bind() 方法创建一个新的函数,在调用时设置 this
关键字为提供的值。并在调用新函数时,将给定参数列表作为原函数的参数序列的前若干项。bind()方法会创建一个函数的实例,其 this 值会被绑定到传给 bind()函数的值。意思就是 bind() 会返回一个新函数。
区别
执行:
call/apply改变了函数的this上下文后马上执行该函数
bind则是返回改变了上下文后的函数,不执行该函数
返回值:
call/apply 返回fun的执行结果
bind返回fun的拷贝,并指定了fun的this指向,保存了fun的参数。
语法:
let obj = {
name:"张三",
fn(){
console.log(this.name);
}
}
let obj1 = {
name:"李四"
}
obj.fn.call(obj1,"");
// 使用call改变this指向
obj.fn.apply(obj1,[]);
// 使用apply改变this指向
obj.fn.bind(obj1)();
// 使用bind改变this指向