前言>
前端小菜鸡一枚,分享的文章纯属个人见解,若有不正确或可待讨论点可随意评论,与各位同学一起学习~
箭头函数和普通函数的区别?
1. 箭头函数比普通函数语法更加简洁:
- 没有参数时,写一个空括号即可
- 只有一个参数时,可省去参数的括号
- 有多个参数时,用逗号分割
- 函数体只有一句时,可省去大括号
- 如果函数体不需要返回值,且只有一句话,在这个语句前加一个 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)