手记

热点面试题:箭头函数与普通函数的区别?

前言>

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

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

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

  1. 没有参数时,写一个空括号即可
  2. 只有一个参数时,可省去参数的括号
  3. 有多个参数时,用逗号分割
  4. 函数体只有一句时,可省去大括号
  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 关键字

文章特殊字符描述:

  1. 问题标注 Q:(question)
  2. 答案标注 R:(result)
  3. 注意事项标准:A:(attention matters)
  4. 详情描述标注:D:(detail info)
  5. 总结标注:S:(summary)
  6. 分析标注:Ana:(analysis)
  7. 提示标注:T:(tips)
2人推荐
随时随地看视频
慕课网APP