javascript - ES6对象中的方法: using arrow functions

Question

在 ES6 中，这两者都是合法的:

var chopper = {
    owner: 'Zed',
    getOwner: function() { return this.owner; }
};

并且，作为简写:

var chopper = {
    owner: 'Zed',
    getOwner() { return this.owner; }
}

是否也可以使用新的箭头功能？在尝试类似的事情

var chopper = {
    owner: 'John',
    getOwner: () => { return this.owner; }
};

或

var chopper = {
    owner: 'John',
    getOwner: () => (this.owner)
};

我收到一条错误消息，表明该方法无权访问 this。这只是一个语法问题，还是不能在 ES6 对象中使用粗箭头方法？

Answer 1

箭头函数并非旨在仅作为老式函数的较短版本在所有情况下使用。它们无意于使用 function 关键字替换函数语法。箭头函数最常见的用例是短“lambda”，它不会重新定义 this，通常在将函数作为回调传递给某个函数时使用。

箭头函数不能用于编写对象方法，因为正如您所发现的，由于箭头函数在词法封闭上下文的 this 上闭合，因此箭头是当前定义对象的箭头。也就是说:

// Whatever `this` is here...
var chopper = {
    owner: 'Zed',
    getOwner: () => {
        return this.owner;    // ...is what `this` is here.
    }
};

在您的情况下，想要在对象上编写方法，您应该简单地使用传统的 function 语法，或 ES6 中引入的方法语法:

var chopper = {
    owner: 'Zed',
    getOwner: function() {
        return this.owner;
    }
};

// or

var chopper = {
    owner: 'Zed',
    getOwner() {
        return this.owner;
    }
};

(它们之间有细微的差别，但只有当您在 getOwner 中使用 super(而您没有这样做)时，或者如果您复制 getOwner 到另一个对象。)

es6 邮件列表上存在一些关于箭头函数的争论，箭头函数具有相似的语法，但有自己的 this。然而，这个提议并没有得到很好的接受，因为这只是语法糖，允许人们节省输入几个字符，并且没有为现有函数语法提供新功能。查看主题unbound arrow functions .