箭头函数中this的指向

箭头函数在平时开发中用着非常爽，箭头函数有什么特点呢

• 箭头函数不能够当做构造函数使用
• 箭头函数没有arguments对象
• 箭头函数不能够用yield，不能用作generator函数
• 箭头函数没有prototype属性，prototype属性值为空
• 箭头函数的this总是指向最近一层的作用域

举个例子，总所周知普调函数的this指向都是谁调用他指向谁

var name ="张三"
var obj = {
    name: '李四',
    getName: function() {
        console.log(this.name)
        return function(){
            console.log(this.name)
        }
    }
}
obj.getName()()
// 输出结果
// 李四
// 张三

因为obj.getName()相当于是obj调用的，所以里面的this指向obj，obj.getName()()相当于是window调用的

obj.getName()()
// 等价于
var fn = obj.getName()
window.fn()

另外一个例子

var name ="张三"
var obj = {
    name: '李四',
    getName: function() {
        console.log(this.name)
        return s = () =>{
            console.log(this.name)
        }
    }
}
obj.getName()()
// 输出结果
// 李四
// 李四

在getName中返回一个箭头函数，因为箭头函数是在getName中，getName是它的一个上最近的一个函数作用域,所以箭头函数中的this指向obj。另外一个例子

var name ="张三"
var obj = {
    name: '李四',
    getName: () => {
        console.log(this.name)
        return s = () =>{
            console.log(this.name)
        }
    }
}
obj.getName()()

会输出什么结果，大部分人可能跟我一样会认为会输出

李四 李四  // 其实最终的结果是张三 张三

刚开始都以为getName这个箭头函数是指向的object，其实不然，它是指向window的。箭头函数的this是 根据该函数的作用域指向的对象,作用域是指函数内部，getName作用域其实是指最外层的js环境，因为getName没有被函数包裹,最外层又是指向window

• 箭头函数使用call applay等改变this的指向也是没有用的，比如

var name ="张三"
var obj = {
    name: '李四',
    getName: () => {
        console.log(this.name)
    }
}
var obj1 = {
    name: '李四',
    getName: function() {
        console.log(this.name)
    }
}
obj.getName.call({name: '王五'}) // 张三
obj1.getName.call({name: '王五'}) // 王五