箭头函数和普通函数的主要区别:
- this的指向问题，箭头函数是不存在this的（也是箭头函数和普通函数最主要的区别）
- 箭头函数没有原型prototype
- 箭头函数没有argements(类数组)
一、this的指向问题（也是箭头函数和普通函数最主要的区别）
（1）箭头函数是不存在this的，它的this是继承自父执行的上下文中，而且不能使用call、apply、bind来改变this的指向，箭头函数中的this是永远不会改变的。
比如这里的箭头函数的this.x，箭头函数和say平级以key:value的形式，也就是箭头函数本身所在的对象为obj，而obj的父执行上下文就是window，所以这里的this.x实际上表示的是window.x，因此输出11.
var x = 11;
var obj = {
x:22,
say:()=>{
console.log(this.x);
}
}
obj.say();//11
（2） 普通函数this指向的是它的直接调用者。
// 普通函数
var name = "ice";
var obj = {
name: "leaf",
getName: function() {
console.log(this.name);//this指的是它的直角调用者，就是obj,所以返回leaf
}
};
obj.getName(); // 此时指向调用者obj,输出leaf
//箭头函数
var name = "ice";
var obj = {
name: "leaf",
getName: () => {
console.log(this.name);
// 指向定义时所在的对象，name是在全局的环境下创建的，所有this指向的是全局对象
}
};
obj.getName();//ice
var obj1 = { name: "haha" };
obj.getName.call(obj1); // 无法改变this指向 输出还是ice
二、箭头函数没有原型prototype，是不能够被作为构造函数调用的，会报错；
//普通函数
function Person() {
console.log("person");
}//定义一个构造函数
const myFather = new Person();//构造函数的实例化对象
//箭头函数
let Person2 = () => {
console.log("person2");
}
console.log(Person2.prototype);//undefined
const myFather2 = new Person2();////Person2 is not a constructor
三、箭头函数没有argements(类数组)，只能基于...arg来获取参数集合（数组）
let Person2 = () => {
console.log(person2.argements);
}
Person2(10,20,30)// Person3 is not defined
//只能使用...arg来获取参数集合（数组）
let Person2 = (...arg) => {
console.log(arg);
}
Person2(10, 20, 30)// [10, 20, 30]
持续补充更新，记录不好的地方望指出修改，共同进步~
