this指向问题
1、普通函数
function test (){
console.log('函数')
console.log(this)
}
test()
结果:指向window
2、对象方法
const obj = {
name='shm',
sayHi() {
console.log('hi')
console.log(this)
}
}
obj.sayHi()
结果:指向obj
3、函数调用方法
function test (){
console.log('函数')
console.log(this)
}
const obj = {
name='shm',
sayHi() {
console.log('hi')
console.log(this)
}
}
test = obj.sayHi
test()
结果;指向window
PS:赋予的值会覆盖掉原本test函数内的内容
4、方法调用函数
function test (){
console.log('函数')
console.log(this)
}
const obj = {
name='shm',
sayHi() {
console.log('hi')
console.log(this)
}
}
obj.sayHi = test
obj.sayHi()
结果:指向obj对象
PS:同样覆盖
特例
1、构造函数
function test (){
console.log('函数')
console.log(this)
}
const t = new test()
console.log(t)
结果:指向t实例
2、箭头函数
function test (){
console.log('函数')
console.log(this)
()=>{
console.log('箭头函数')
}
}
const t = new test()
console.log(t)
结果:指向t实例
PS:箭头函数没有自己的this,向外找this,找到test(),由于test作为构造函数使用,this指向t实例
## 总结 ##
1、this永远指向真正的调用者,函数调用者为window,方法调用者为obj。<br/>
2、箭头函数本身没有this,向外找this。
若函数作为构造函数(new)使用,可以认为是通过创建一个实例(t),由t来调用这个构造函数
例如,普通函数test()的this指向window,当前面加上new后 const t= new test()的this指向 t。