箭头函数中“this”的可见性

Question

我有两个案例

const test = {
    foo: function (){
        this.bar();
    },
    bar: function (){
        console.log('bar');
    }
}
test.foo();

在这种情况下，一切正常。

const test = {
    foo: () => {
        this.bar();
    },
    bar: () => {
        console.log('bar');
    }
}
test.foo();

在第二种情况下，我收到错误：

Uncaught TypeError: Cannot read property 'bar' of undefined

我知道我可以在test.bar()函数中编写foo，但我很感兴为什么在这种情况下this在箭头函数范围内不可用。

Answer 1

通常，函数中this的值取决于函数的调用方式。

箭头函数从创建函数的作用域中导入this的值。

在对象文字的中间，this的值将取决于对象文字周围的内容，但肯定不是对象本身。