目录
1.基本使用
箭头函数也是一种定义函数的方式
定义函数的方式:
①用function
const aaa = function() {}
②用对象字面量
const obj = {
bbb: function() {},
bbb() {}
}
③ES6里面的箭头函数
const ccc = (参数列表) => {}
没参数: const obj = () => {}
有参数:
有一个参数: const product = num => { return num * num }
有两个参数: const sum = (num1,num2) => {return num1 + num2}
当函数体中只有一行代码时,可以这样简写:
const sum = (num1,num2) => num1 + num2
不用写return,因为它会自动帮你返回
2.箭头函数里面的this指向
箭头函数里面的this指向的是最近作用域的this
setTimeout() 是属于window 的方法,函数中的this会指向window对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Title</title>
</head>
<body>
<script>
setTimeout(function () {
console.log(this) //window
}, 1000)
setTimeout(() => {
console.log(this) //window
}, 1000)
const obj = {
aaa(){
setTimeout(function () {
console.log(this) //window
}, 1000)
setTimeout(() => {
console.log(this) //obj
}, 1000)
},
bbb(){
setTimeout(function () {
setTimeout(function () {
console.log(this) //window
}, 1000)
setTimeout(() => {
console.log(this) //window
}, 1000)
}, 1000)
setTimeout(() => {
setTimeout(function () {
console.log(this) //window
}, 1000)
setTimeout(() => {
console.log(this) //obj
}, 1000)
}, 1000)
}
}
obj.aaa()
obj.bbb()
</script>
</body>
</html>