箭头函数中的this

上一次学习箭头函数, 只是懂它的写法, 但不是很清楚他的语法, 所以这次重新学习了箭头函数, 也算全部都搞懂了

  1. 箭头函数没有自己的this ,箭头函数的this不是调用的时候决定的, 而是取决于你定义的这个对象 。

  2. 扩展: 如果箭头函数外面还存在函数

    • 若是普通函数,则箭头函数中的this为普通函数的this
    • 若是箭头函数, 则箭头函数中的this为Windows
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button id="b1">1</button>
<button id="b2">2</button>
<button id="b3">3</button>
</body>
<script>
let aaa = document.getElementById('b1')
let bbb = document.getElementById('b2')
let ccc = document.getElementById('b3')
let obj = {
a: 123,
b: 321,
c: this.a,
o: () => {
aaa.onclick = () => {
console.log(this)
}
},
oo: oo = () => {
bbb.onclick = () => {
console.log(this)
}
ccc.onclick = () => {
console.log(this)
}
}
}
obj.o()
obj.oo()

//执行结果都为Window

</script>

</html>

(完)

分享到