热点面试题：箭头函数与普通函数的区别？

前言

前端小菜鸡一枚，分享的文章纯属个人见解，若有不正确或可待讨论点可随意评论，与各位同学一起学习~

箭头函数和普通函数的区别？

1. 箭头函数比普通函数语法更加简洁：

1. 1. 没有参数时，写一个空括号即可
2. 2. 只有一个参数时，可省去参数的括号
3. 3. 有多个参数时，用逗号分割
4. 4. 函数体只有一句时，可省去大括号
5. 5. 如果函数体不需要返回值，且只有一句话，在这个语句前加一个 void 关键字即可，最常见的就是调用一个函数。let fn = () => void doesNotRetruen();

2. 箭头函数没有自己的 this

3. 箭头函数继承来的 this 指向永远不会改变

var id = "GLOBAL";
var obj = {
    id: "OBJ",
    a: function () {
        console.log(this.id);
    },
    b: () => {
        console.log(this.id);
    },
};
obj.a(); // 'OBJ'
obj.b(); // 'GLOBAL'
new obj.a(); // undefined
new obj.b(); // Uncaught TypeError: obj.b is not a constructor

4. call, apply, bind 等方法不能改变箭头函数中 this 指向

var id = "Global";
let fun1 = () => {
    console.log(this.id);
};
fun1(); // 'Global'
fun1.call({ id: "Obj" }); // 'Global'
fun1.apply({ id: "Obj" }); // 'Global'
fun1.bind({ id: "Obj" })(); // 'Global'

5. 箭头函数不能作为构造函数使用：在构造函数 new 的步骤中，有一步是将函数中的 this 指向新的对象，在箭头函数中，因为没有自己的 this，且 this 指向外层的执行环境，且不能改变指向，所以不能当成构造函数使用

6. 箭头函数没有自己的 arguments

7. 箭头函数没有原型 prototype

8. 箭头函数不能用于语法糖 Generator，不能使用 yeild 关键字

文章特殊字符描述

•问题标注 Q:(question)•答案标注 R:(result)•注意事项标准：A:(attention matters)•详情描述标注：D:(detail info)•总结标注：S:(summary)•分析标注：Ana:(analysis)•提示标注：T:(tips)