具有箭头功能的 ES6吸气器/排气器

我正在使用 babel6和我的宠物项目,我正在为 XMLHttpRequest创建一个包装,我可以使用的方法:

const open = (method, url, something) => {
return this.xhr.open(method, url, something);
}

但是,对于属性,箭头函数不起作用:

get status() { return this.xhr.status; }

但是我不能使用箭头函数:

get status = () => this.xhr.status;

这是故意的吗?

46604 次浏览

根据 ES2015语法,对象文字上的属性只能是以下三种情况之一:

定义:

  • IdentifierReference
  • PropertyName : < em > AssignmentExpression
  • 方法定义

其中唯一允许领先 get的类型是 < em > 方法定义 :

方法定义 :

  • PropertyName ( 严格形式参数 ) { 函数身体 }
  • 生成器方法
  • get PropertyName ( ) { 函数身体 }
  • set PropertyName(PropertySetParameter 参数列表){函数身体}

正如您可以看到的,get表单遵循的语法非常有限,必须符合表单的格式

get NAME () { BODY }

该语法不允许使用 get NAME = ...形式的函数。

接受的答案是伟大的。这是最好的,如果你愿意使用 正常函数语法而不是 紧凑的“箭头函数语法”。

但是,也许您确实喜欢箭头函数; 也许您使用箭头函数是出于另一个原因 正常的函数语法无法替代的; 您可能需要一个不同的解决方案。

例如,我注意到 OP 使用 this,您可能希望使用 在词法上绑定 this; 也就是“非绑定的 this”) ,箭头函数对于词法绑定很有用。

您仍然可以通过 Object.defineProperty技术使用带有 getter 的箭头函数。

{
...
Object.defineProperty(your_obj, 'status', {
get : () => this.xhr.status
});
...
}

参见提到的 ABC0技术 (aka get NAME() {...})ABC2技术 (aka get : ()=>{})。使用 defineProperty需要已经存在的变量,这里至少有一个显著差异:

存在的物体上定义 getter

也就是说,对于 Object.defineProperty,您必须确保 your_obj(在我的示例中)存在并保存到一个变量中(而对于 object-initialization,您可以在对象初始化中返回一个对象文本: {..., get(){ }, ... })。更多关于 特别是 Object.defineProperty在这里的信息

Object.defineProperty(...)似乎有与 get NAME(){...}语法类似的浏览器支持; 现代浏览器 IE9。