箭头函数

Wed, 02 Oct 2024 00:00:00 +0800

一、箭头函数的特点

1. 相比普通函数，箭头函数有更加简洁的语法。

普通函数

function add(num) {
 return num + 10
}

箭头函数

const add = num => num + 10;

2. 箭头函数不绑定this，会捕获其所在上下文的this，作为自己的this。

这句话需要注意的是，箭头函数的外层如果有普通函数，那么箭头函数的this就是这个外层的普通函数的this，箭头函数的外层如果没有普通函数，那么箭头函数的this就是全局变量。

下面这个例子是箭头函数的外层有普通函数。

let obj = {
 fn:function(){
 console.log('我是普通函数',this === obj) // true
 return ()=>{
 console.log('我是箭头函数',this === obj) // true
 }
 }
}
console.log(obj.fn()())

下面这个例子是箭头函数的外层没有普通函数。

let obj = {
 fn:()=>{
 console.log(this === window);
 }
}
console.log(obj.fn())
// true

箭头函数 on Last Stand

箭头函数

一、箭头函数的特点

1. 相比普通函数，箭头函数有更加简洁的语法。

2. 箭头函数不绑定this，会捕获其所在上下文的this，作为自己的this。

3. 箭头函数是匿名函数，不能作为构造函数，不可以使用new命令，否则后抛出错误。