每个函数都有一个关键字叫this,在不同的情况下,this代表的内容也是不同的
1. 普通函数中的this代表window对象function fn(){
console.log(this);
}
fn(); // window
2.定时器中的this代表window对象
let obj={
run:()=>{
setTimeout(()=>console.log(this))
}
}
obj.run();//window
3.自调用函数中的this代表window对象
function fn(){
(function(){
console.log(this);
})();
}
fn()
4.对象方法中的this代表调用这个方法的对象
let obj={
name:"dog",
run:function(){
console.log(this)
}
}
obj.run();
5.事件函数中的this代表当前事件的事件源
document.querySelector("button").onclick=function(){
console.log(this);
}
//
6.箭头函数的this在定义箭头函数就知道了,代表上一层代码的this
document.querySelector("button").onclick=function(){
// 这里的this代表button按钮,所以箭头函数的this也是button按钮
setTimeout(()=>{console.log(this);});
}
//
总结:函数内部的 this 只和函数的调用方式有关系,和函数的定义方式没有关系。箭头函数在定义的时候this代表上一层代码的this