<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="box">盒子</div>
<script>
// let fn1 = function(x,y){}
// //定义箭头函数
// let fn1 = () => {} //标准形式
// //只有一个形参,小括号可以省略
// let fn = x => {console.log(x)}
// //如果有多个形参,小括号不可以省略
// let fn = (x,y) => {console.log(x,y)}
// //如果函数体中只有一行代码/表达式,就可以忽略花括号和return,会自动return
// let fn = (x,y) => x
// let fn = function(x,y){
// return x
// }
// let box = document.getElementById('box')
// box.onclick = function() {
// setInterval(function(){
// console.log(this.innerText) //这里的this指向window,不是box。因为this从里向外找第一个this,function相当于windows
// },2000)
// }
// let box = document.getElementById('box')
// box.onclick = function() {
// setInterval(() => {
// console.log(this.innerText) //这里的this指向box,箭头函数中没有this
// },2000)
// }
// let box = document.getElementById('box')
// box.onclick = () => {
// setInterval(() => {
// console.log(this.innerText) //这里的this指向window,箭头函数中没有this,如果一堆箭头函数嵌套,都没有this,最终这个this指向window
// },2000)
// }
// //注意:箭头函数因为没有this,所以不能当作构造函数,也就是不能new
// let Person = (name,age) => {
// this.name = name
// this.age = age
// }
// new Person('zs',18)
// //箭头函数中没有arguments
// let f3 = () => {
// console.log(arguments)//arguments is not defined
// }
// f3()
</script>
</body>
</html>
箭头函数的使用
最新推荐文章于 2024-07-29 11:53:27 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)