Javascript,扩展ES6类setter将继承getter

cod*_*imp 5 javascript boilerplate extend es6-class

在Javascript中,使用以下插图代码:

class Base {
   constructor() {  this._val = 1   }
   get val()     { return this._val }
}

class Xtnd extends Base {
   set val(v)    { this._val = v }
}

let x = new Xtnd();
x.val = 5;
console.log(x.val);  // prints 'undefined'
Run Code Online (Sandbox Code Playgroud)

实例x不会get val()...Base类继承.实际上,Javascript在存在setter时将缺少getter视为未定义.

我有一种情况,其中我有许多类都具有完全相同的getter集但是唯一的setter.目前,我只是复制每个类中的getter,但我正在重构并想要消除冗余代码.

有没有办法告诉JS保持基类的getter,或者有没有人有这个问题的优雅解决方案?

Pat*_*rts 6

这种限制是由于JavaScript如何处理幕后的属性访问器.在ECMAScript 5中,您最终得到的原型链具有属性描述符,该属性描述符用于您的类定义valget方法,以及set未定义的方法.

在您的Xtnd类中,您有另一个属性描述符,用于val隐藏基类的整个属性描述符val,包含set由类定义的get方法和未定义的方法.

为了将getter转发到基类实现,遗憾的是你需要在每个子类中使用一些样板,但是你至少不必复制实现本身:

class Base {
   constructor() {  this._val = 1   }
   get val()     { return this._val }
}

class Xtnd extends Base {
   get val()     { return super.val }
   set val(v)    { this._val = v }
}

let x = new Xtnd();
x.val = 5;
console.log(x.val);  // prints 'undefined'
Run Code Online (Sandbox Code Playgroud)