1、定义方式
// 箭头函数
function func=()=>{
// code
}
//普通函数
function func() {
// code
}
2、是否匿名
箭头函数都是匿名函数,而普通函数可以有匿名函数也可以有具体名
// 箭头函数
let func=()=>{
// code
}
//具名函数
function func() {
// code
}
//匿名函数
let func = function(){
// code
}
3、箭头函数不能用于构造函数,不能使用new
function Person(name,age){
this.name = name;
this.age = age;
}
let xhh = new Person('小花花',18);
console.log(xhh.name); // 小花花
console.log(xhh.age); // 18
Person 用作构造函数,可以通过Person创建实例对象。
4、箭头函数中this指向不同
4.1 箭头函数本身不创建this,它在声明时可以捕获其所在上下文的this供自己使用(并且this一旦被捕获,就不再发生变化)
var name = "张三"
function wrap(){
this.name = "李四";
let func=()=> {
console.log(this.name);
}
func();
}
let en = new wrap();//李四
分析:
构造函数:wrap()
this指向:创建的实例化对象en
箭头函数this指向:实例化对象en
4.2 结合call().apply()方法使用
箭头函数结合call(),apply()方法调用一个函数时,只传入参数,对this没有影响。
let obj = {
a:10,
b:function(n) {
let f = (n) => n+this.a;//this指向obj
return f(n);
},
c:function(n) {
let f = (n) => n + this.a;//this指向obj
let m = {
a:20
}
return f.call(m,n);
}
}
console.log(obj.b(1));//11
console.log(obj.c(1));//11
面试中可能会问到的问题:
两者区别、箭头函数的this指向、是否能new、能否调用apply,bind、结果是什么,只调用只能绑定参数不能修改this指向。
箭头函数的this永远指向其上下文的this,无法改变指向;普通函数的this指向调用它的对象。
参考:https://blog.csdn.net/qq_42258904/article/details/110083064