面试题6：ES6箭头函数与普通函数的区别

普通函数和箭头函数的区别：
…………………………………………………………………………………………………………………………………………
箭头函数的this指向规则：

1. 箭头函数没有prototype(原型)，所以箭头函数本身没有this
function test1 () {
console.log(test1.prototype)
}
test1() //普通函数 constructor: f test1()
const test2 = () => {
console.log(test2.prototype)
}
test2() //箭头函数 undefined;

箭头函数的 this 永远指向其上下文的 this ，任何方法都改变不了其指向，如 call() , bind() , apply()
普通函数的this指向调用它的那个对象
……………………………………………………………………………………………………………………………………
箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值
箭头函数的this指向在定义的时候继承自外层第一个普通函数的this。

var obj = {
a: 10,
b: () => {
console.log(this.a); // undefined
console.log(this); // Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}
},
c: function() {
console.log(this.a); // 10
console.log(this); // {a: 10, b: ƒ, c: ƒ}
}
}
obj.b();
obj.c();

………………………………………………………………………………………………………………………………

var obj = {
a: 10,
b: function(){
console.log(this.a); //10
},
c: function() {
return ()=>{
console.log(this.a); //10
}
}
}
obj.b();
obj.c()();

………………………………………………………………………………………………………………………………
箭头函数相当于匿名函数，并且简化了函数定义。
箭头函数有两种格式，一种只包含一个表达式，连{ … }和return都省略掉了。
还有一种可以包含多条语句，这时候就不能省略{ … }和return。
………………………………………………………………………………………………………………………………
箭头函数是匿名函数，不能作为构造函数，不能使用new

let test3 = () => {
console.log(this)
}
let test4 = new test3()

……………………………………………………………………………………………………………………………………
箭头函数不绑定arguments，取而代之用rest参数…解决
【ES6引入reset参数（形式为…变量名），用于获取函数的多余参数，这样就不需要使用arguments对象了。reset参数搭配的变量是一个数组】

function A (a) {
console.log(arguments)
}
A(1,2,3,4);

const B = (...b) => {
console.log(b)
};
B(5,6,7,8);

const C = (c) => {
console.log(arguments)
};
C(9,10,11,12);

………………………………………………………………………………………………………………………………
箭头函数通过 call() 或 apply() 方法调用一个函数时，只传入了一个参数，对 this 并没有影响。

let obj2 = {
a: 10,
b: function(n) {
let f = (n) => n + this.a;
return f(n);
},
c: function(n) {
let f = (n) => n + this.a;
let m = {
a: 20
};
return f.call(m,n);
}
};
console.log(obj2.b(1));  // 11
console.log(obj2.c(1)); // 11

………………………………………………………………………………………………………………………………
箭头函数没有prototype（原型属性）
const a = ()=>{
return 1;
}

function b(){
return 2;
}

console.log(a.prototype);  // undefined
console.log(b.prototype);   // {constructor: ƒ}

………………………………………………………………………………………………………………………………

小结：

1. 箭头函数没有prototype(原型)，所以箭头函数本身没有this
2. 箭头函数的this在定义的时候继承自外层第一个普通函数的this。
3. 如果箭头函数外层没有普通函数，严格模式和非严格模式下它的this都会指向window(全局对象)
4. 箭头函数本身的this指向不能改变，但可以修改它要继承的对象的this。
5. 箭头函数的this指向全局，使用arguments会报未声明的错误。
6. 箭头函数的this指向普通函数时,它的argumens继承于该普通函数
7. 使用new调用箭头函数会报错，因为箭头函数没有constructor
8. 箭头函数不支持new.target
9. 箭头函数不支持重命名函数参数,普通函数的函数参数支持重命名
10. 箭头函数相对于普通函数语法更简洁优雅
11. 箭头函数不能当做Generator函数,不能使用yield关键字(python)

箭头函数的注意事项：

1. 箭头函数一条语句返回对象字面量，需要加括号
2. 箭头函数在参数和箭头之间不能换行
3. 箭头函数的解析顺序相对**||**靠前

不适用场景：
箭头函数的this意外指向和代码的可读性。