箭头函数有几个使用注意点:
- 函数体内的this对象就是定义时所在的对象，而不是使用时所在的对象。
- 不可以当做构造函数。也就是说，不可以使用new 命令，否则会抛出一个错误。
- 不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用rest参数代替。
- 不可以使用yield 命令，因此箭头函数不能用作Generator函数。
普通函数的this指向是可变的，但是箭头函数中this是固定的。
普通函数
function foo() {
setTimeout(function() {
console.log(this);
console.log('id:', this.id);
})
}
foo.call({ id: 2 })
// 输出
// Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}
// id: undefined
上面代码中，setTimeout的参数是一个箭头函数，100毫秒后执行。
普通函数，执行时，this的指向是全局对象window，由于window里没有id，输入undefined
箭头函数
function foo() {
setTimeout(() => {
console.log('id:', this.id);
}, 100)
}
foo.call({ id: 1 });
// 输出
// id: 1
箭头函数导致this总是指向函数所在的对象，即为：foo
一、 this指向它所在的对象
const handler = {
id: '123456',
init: function() {
document.addEventListener('click',
event => this.doSomething(event.type), false);
},
doSomething: function(type) {
console.log('Handling', type, ' for ', this.id);
},
}
console.log(handler);
handler.init();
// 输入
// {id: "123456", init: ƒ, doSomething: ƒ}
// Handling click for 123456
上面的init方法中使用了箭头函数，这时this的指向是它所在的对象，即：handler对象。否则，回调函数运行时，this.doSomething会报错，因为this指向全局对象。
二 、 this指向它所在的对象
function Timer () {
this.seconds = 0;
setInterval(() => this.seconds+=1, 1000);
}
const timer = new Timer();
setTimeout(() => console.log(timer.seconds), 3000);
// 输入
// 3
上面代码中，Timer函数内部的setInterval调用了this.seconds属性，通过箭头函数让this总是指向Timer的实例对象。
this指向的固定化，并不是因为箭头函数内部有绑定this 的机制，实际原因是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this。
正因为它没有this， 所以也就不能用作构造函数，
function foo() {
return () => {
return () => {
return () => {
console.log('id: ', this.id);
}
}
}
}
foo.call({ id: 3 })()()();
// 输入
// 3
上面代码中只有一个this，就是函数foo的this。因为所有的内层函数都是箭头函数，都没有自己的this。
