Babel.js 带箭头功能的ES6 getter/setter

jyztefdp  于 2022-12-08  发布在  Babel
关注(0)|答案(2)|浏览(223)

我正在使用babel6,并为我的宠物项目创建一个XMLHttpRequest的 Package 器,用于我可以使用的方法:

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

但对于属性,箭头函数不起作用。这是有效的:

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

但我不能使用箭头功能:

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

这是故意的吗?

von4xj4u

von4xj4u1#

根据ES2015语法,对象常值上的属性只能是下列三项之一:

  • 属性定义 *:
    • 标识符引用 *
    • 属性名称 * : * 赋值表达式 *
    • 方法定义 *

这些型别中唯一允许前置get的是 MethodDefinition

  • 方法定义 *:
    • 属性名称 * ( * 严格形式参数 * ){ * 函数主体 * }
    • 生成器方法 *
      ***get***属性名称 * (){ * 函式主体 * }
      ***set***属性名 属性集参数列表 * ){ * 函数体 * }

正如您所看到的,get形式遵循的语法非常有限,必须是以下形式

get NAME () { BODY }

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

crcmnpdw

crcmnpdw2#

公认的答案是好的。如果你愿意使用 normal 函数语法而不是 *compact“arrow function syntax”,这是最好的。
但也许你真的喜欢箭头功能;也许您使用箭头函数的另一个原因 * 是普通函数语法无法替代的 *;您可能需要不同的解决方案。
例如,我注意到OP使用this,您可能希望按词法绑定this; aka“non-binding of this”),而箭头函数适合于词法绑定。
您仍然可以通过Object.defineProperty技术使用带有getter的箭头函数。

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

参见**object initialization技术**(又名get NAME() {...})与**defineProperty技术**(又名get : ()=>{})的提及。至少存在一个显著差异,使用defineProperty需要变量已经存在:
在 * 现有对象 * 上定义getter
例如,对于Object.defineProperty,您必须确保your_obj(在我的示例中)存在并保存到一个变量中(而对于object-initialization,您可以在对象初始化中返回一个object-literal:{..., get(){ }, ... })。有关Object.defineProperty specifically, here的更多信息
Object.defineProperty(...)似乎具有与get NAME(){...}语法相当的浏览器支持;现代浏览器,IE 9。

相关问题