特殊函数类型:箭头函数。
1.
箭头函数并不是使用function关键字定义的,而是使用被称为“胖箭头”的操作符=>定义的。箭头函数是根据外层(函数或者全局)作用域来决定this。
箭头函数的词法作用域:
function foo() {
// 返回一个箭头函数
return (a) => {
// this继承自foo()
console.log(this.a)
}
}
var obj1 = {
a: 2
}
var obj2 = {
a: 3
}
var bar = foo.call(obj1)
bar.call(obj2) // 2 不是3
foo()内部创建的箭头函数会捕获调用时foo()的this。由于foo()的this绑定到obj1。bar(引用箭头函数)的this也会绑定到obj1,箭头函数的绑定无法被修改。
2.
箭头函数最长用于回调函数中,例如事件处理器或者定时器:
function foo() {
setTimeout(() => {
// 这里的this在词法上继承自foo()
console.log(this.a)
}, 100)
}
var obj = {
a: 2
}
foo.call(obj) //2
3.
箭头函数可以像bind(..)一样确保函数的this被绑定到指定对象,此外,其重要性还体现在它用更常见的词法作用域取代了传统的this机制。实际上,在ES6之前我们就已经在使用一种几乎和箭头函数完全一样的模式:
function foo() {
var self = this
setTimeout(function () {
console.log(self.a)
}, 100)
}
var obj = {
a: 2
}
foo.call(obj) //2