箭头函数

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第4天，点击查看活动详情

回顾:this指向

1. 通过对象调用函数，this就指向对象
2. 通过调用函数，this指向全局对象
3. 通过new调用函数，this指向新创建的对象
4. 通过apply或者call、bind等调用函 数，this指向指定的数据
5. 如果是dom事件函数，this指向事件源

使用语法

箭头函数是一个函数表达式 并且箭头函数并不会函数声明提升 理论上任何使用函数表达式的场景上都可以使用箭头函数

完整语法:

(参数1,参数2,参数3)=>{ 函数体 }

如果参数只有一个，可以省略小括号

参数=>{
    函数体
}

如果箭头函数只有一条语句，且这条语句是返回语句，可以省略 “{}”，和return关键字

 参数=> 返回值  例如

 判断一个数是不是奇数
   const isOdd=function(num){
        return num%2!==0
    }
    简化写法
    const isODD= num=> num %2!==0;

如果我们返回的结果是对象呢？

        onst isODD= num=> {
            name:'张三'
        }

上面的写法是错误的，浏览器会将“{}”解析成箭头函数的大括号

解决方案：为{}套上()

onst isODD= num=> ({ name:'张三' })

注意细节

箭头函数的函数体中的this，取决于箭头函数声明定义的位置的this指向，而与如何调用无关

箭头函数中,不存在this、arguments、new.target, 如果使用了则使用的是函数外层对应的 this、arguments、new.target

箭头函数没有原型 由于箭头函数没有原型，所以箭头函数不能作为构造函数使用

应用场景

1. 临时性使用的函数，并不会刻意调用它，比如： 1.1 事件处理函数 1.2 异步处理函数 1.3 其他临时性的函数
2. 为了绑定外层的this函数
3. 在不影响其他代码的情况下，保持代码简洁，最常见的，就是数组当中的回调函数