this指向问题
来源：5-6 箭头函数
前端小白白白白白白
2021-02-28 13:52:12
const xiaoming={
name:'小明',
age:null,
getAge:function(){
var that=this //这里的this为什么能访问到xiaoming，好久没用忘记了
setTimeout(function(){
that.age=14
})
}
}
2回答
-
好帮手慕慕子
2021-02-28
同学你好， 对于你的问题解答如下：
1、因为是通过xiaoming这个对象调用的getAge方法，即：xiaoming.getAge()；所以函数内部的this指向xiaoming。
2、第二次粘贴的代码中注释理解整体是对的，但是有两处细节需要注意下，其中的getAge和getAgeArrow是普通函数，他们内部的this指向调用函数的对象，而不是在声明的时候就生成this，由于使用xiaoming这个对象调用了这两个方法，所以getAge和getAgeArrow函数内部的this指向了xiaoming
祝学习愉快~
0 -
前端小白白白白白白
提问者
2021-02-28
可以这么理解吗
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
const add1=(a,b)=>a+b;//把箭头后运算完后返回
// 可以只为一行，不需要{}包裹,就能默认返回
const add2=(a,b)=>void a+b
// 当单行不需要返回时，可以在运算前添加void阻止返回
const add3=(a,b)=>{
a+b
// 必须有return 才能返回
}
// 与原来下面的方法相等
const add4=function(a,b){
return a+b
}
const xiaoming={
name:'小明',
age:null,
getAge:function(){//这里可以看作已经生成了this，所以this指向这个对象
var that=this
setTimeout(function(){//这里的this是window调用的定时器，所以this是window
that.age=14
// 这里获取到的this是window，所以需要先存放this，才能访问
console.log(that)
})
},
getAgeArrow:function(){//这里看作生成了this
setTimeout(()=>// this箭头函数被定义下的this，与函数同级，所以这里的this就是getAgeArrow的this
//本在settimeout下this只能访问到定时器下的window对象，但由于箭头函数的this指向是与定时器同级，所以都指向xiaoming
this.age=14
console.log(this)
},1000)
}
}
// xiaoming.getAge()
xiaoming.getAgeArrow()
</script>
</body>
</html>
0
相似问题