基本用法
箭头函数
-
let sum = (a, b) => {
-
return a + b;
-
}
-
复制代码
普通函数
-
var sum =
function (a, b){
-
return a + b;
-
}
-
复制代码
区别
之前看阮一峰前辈 es6 文章里提过这个知识点，但是昨天面试被问到了，只回答出了this，所以赶紧抽空整理下知识点，查缺补漏，下面开始正文。
1、 this指向问题
这一点要特别注意，也是面试的时候面试官最关注的。 箭头函数的this指向的是父级作用域的this，是通过查找作用域链来确定 this 的值也就是说，看的是上下文的this，指向的是定义它的对象，而不是使用时所在的对象；普通函数指向的是它的直接调用者。
（1）普通函数的 this 指向可以参考阮一峰的js的this用法 当听到你说 this 的问题，面试官可能会接下去问你 this 的一些拓展问题了，如何改变 this 指向，比如bind方法什么的，然后还可能让你实现 bind，总之真的很多可以问的。
（2）箭头函数的this
-
let obj = {
-
a: 1,
-
b: () => {
-
console.log(this.a); // undefined
-
},
-
c:
function() {
-
console.log(this.a); // 1
-
},
-
};
-
obj.b();
-
obj.c();
-
复制代码
箭头函数没有this，它的this是继承来的，默认指向定义它的时候的对象，就是我们说的宿主对象，而不是执行它的对象。这里通过obj.b()，此时this指向的window对象，上面没有a，所以返回undefined。通过obj.c(),this指向的是它的直接调用者，就是obj，所以返回1。
-
var obj = {
-
a:1,
-
print(){
-
setTimeout(
-
function(){console.log(this.a);},
-
1000
-
);
-
}
-
};
-
obj.print();//undefined
-
复制代码
定时器中的函数由于没有默认宿主对象，setTimeout中的function未被任何对象调用，它的this指向默认是window对象，自然输出undefined。
-
var obj = {
-
a:1,
-
print(){
-
setTimeout(
-
() => { console.log(this.a); },
-
1000
-
);
-
}
-
};
-
obj.print();// 1
-
复制代码
箭头函数的this指的是定义它的对象，所以this指向的是obj对象，所以obj.a确实应该输出1。 ⚠️最后注意，我们前文一直都强调箭头函数没有 this，所以呢，我们不可以用 call()、apply()、bind() 这些方法去改变this的指向。
2、不可以被当作构造函数
不能被当作构造函数来使用，通过new命令来作为构造函数会报错，这里没有构建原型的说法，不存在prototype这个属性，也不能通过super访问原型的属性，而且new target也是不能用的。
3、不可以使用arguments对象，该对象在函数体内不存在，如果要用就用rest参数替代。
-
function f1(arr) {
-
console.log(arguments);
-
}
-
f1([1,2,3]); // [1,2,3]
-
-
let f2 = (arr) => {
-
console.log(arguments);
-
}
-
f2([1,3,9]); //Uncaught ReferenceError: arguments is not defined
-
-
let f3 = (...arr) => {
-
console.log(arr);
-
}
-
f3([1,4,5]); // [1,4,5]
-
复制代码
4、不可以使用yield命令，因此箭头函数不能用作 Generator 函数。
后记
最近因为准备面试，所以打算整理下知识点，方便进行知识整理巩固，文中如有不正确的地方，烦请温柔的批评指正～
212
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
