[油猴脚本开发指南]箭头函数的特性
# 简介如果你在之前已经了解了This的大概含义，那么你理解箭头函数就很容易了！箭头函数是ES6标准中的一个新特性，与普通函数相比没有什么太大区别，唯一比较重要的就是this作用域不同
# ES6是什么
ES6是ECMAScript 6的简称，那他跟JavaScript是什么关系呢？JavaScript 语言是ECMAScript 6标准的实现，而ECMAScript 6 是JavaScript的标准，之所以不叫JavaScript其一是因为版权问题，其二是标准制定者是ECMA(老子搞的凭什么算在JavaScript头上，笑:)
# 箭头函数的使用
使用还是比较简单的()=>{}不需要携带function，只需要在括号内填入函数即可产生一个箭头函数
举个小小的例子
```
let funa=(a)=>{console.log(a.length)}
funa('88888')
```
这里大家就了解了箭头函数的使用了！
# 与普通函数的区别
普通函数的this通常取决于调用者或运行环境，而箭头函数的this取决于声明箭头函数的位置的所处作用域
为什么要这样做呢？
我们可以从一个小例子中看出来一些端倪
```
var cat={
name:'哆来A梦',
eat:function(){
console.log(this.name+'正在吃东西')
}
}
cat.eat()
```
搞一个小猫吃东西，不过分吧？那我想每隔三秒吃一次呢？加个setinterval！
```
var cat={
name:'哆来A梦',
eat:function(){
console.log(this.name+'正在吃东西')
}
}
cat.eat()
setInterval(cat.eat,3000)
```
这个时候并没有符合我们预期，除了我们自己调用的eat有名字，其他都获取不到this.name了，这是为什么？
因为我们把cat.eat函数传入给了Setinterval定时器，定时器在调用函数的时候其作用域并不属于cat,而是window,因为定时器获取的是函数的引用，并且定时器属于window的函数，所以传入的this变成了window
难道希望就要就此破灭了么？不，箭头函数是永远的神！
```
var cat={
name:'哆来A梦',
eat:function(){
return ()=>{console.log(this.name+'正在吃东西')}
}
}
setInterval(cat.eat(),3000)
```
假如我们在eat函数在调用的时返回一个箭头函数，并且在setinterval使用这个箭头函数，就可以正常的输出内容
为什么这个却可以？
因为箭头函数获取的作用域是在创建箭头函数时候的作用域，也就是cat对象的this，所以即使使用Setinterval依然不会影响箭头函数的this，这种特性叫做静态作用域。
那我们为什么不直接写成
```
var cat={
name:'哆来A梦',
eat:()=>{
console.log(this.name+'正在吃东西')
}
}
setInterval(cat.eat,3000)
```
反而要在多一层function呢？
因为箭头函数会获取到所处对象的所在的作用域，也就是windows，那this.name就变成了获取window下的name变量内容了，所以我们才需要使用一层function来保留住箭头函数所处的作用域，这点大家刚开始接触可能难以适应，不如我们简化一下:箭头函数会继承function的this作用域，大部分的时候理解都不会出现太大的问题，如果出现超出你意外的情况就请查阅资料啦！
# 结语
那这节课就算结束了，希望大家清楚了箭头函数的作用以及特性，我们下节课再见啦！
ggnb，ggnb（真是的，说一句ggnb还不行，非要我说两句！！） EXACTLY!! 看完以后，我深有体会，并总结了以下三点：ggnb! ggnb! ggnb! 柒伍七 发表于 2022-2-18 13:57
EXACTLY!! 看完以后，我深有体会，并总结了以下三点：ggnb! ggnb! ggnb!
哥哥牛逼！
页:
[1]