Javascript es6覆盖静态属性 [英] Javascript es6 override static properties

问题描述

尝试使用ES6并尝试创建一个具有静态属性和函数的类来进行解析。然后我想扩展基础解析器为我解析的每个不同的类型。

Trying out ES6 and tried to create a class with static properties and function for parsing. Then I want to extend the base parser for each different type I am parsing. Not sure if I am doing a anti-pattern but I cannot override static properties.

这是我的基本解析器

class Module {

  static name = 'Default Module'
  static version = {major:10000, minor: 10000}

  static checkVersion({majorVersion = 10000, minorVersion = 10000}) {
    if(this.version.major !== majorVersion || this.version.minor > minorVersion) {
      throw `${this.name} requires version ${this.version.major}.${this.version.minor} got ${majorVersion}.${minorVersion}`;
    }
  }

  static parse(data) {
    try {
      this.checkVersion(data);
      return this.internalParser(data);

    } catch (e) {
      throw e;
    }
  }

  static internalParser(data) {
    throw `${this.name} has no parser implemented`;
  }
}

然后我想这样扩展

class ExtendedModule extends Module {
  static name = 'Extended';
  static version = {major: 1, minor:0}

  static internalParser(data) {
    //Some stuff
  }
}

但是在使用babel在节点中编译时，我得到

But when compiling in node with babel I get

true; if ('value' in descriptor) descriptor.writable = true; Object.defineProp
                                                                    ^
TypeError: Cannot redefine property: name
    at Function.defineProperty (native)

任何人都可以得到一个线索，如果这是可能的或只是纯粹错了？

Anyone got a clue if this is even possible or just plain wrong?

推荐答案

函数（在convertiled代码中），当你定义静态属性，它们直接附加到类构造函数，因此：

Classes are functions (in transpiled code), and when you define static properties, they are attached directly to the class constructor function, so:

class Foo {
    static name = 'foo';
}

与执行

function Foo(){}
Object.definedProperty(Foo, 'name', {
    configurable: true,
    writable: true
    value: 'foo'
});

如果你在浏览器中这样做，你会得到一个错误，看见。这是因为函数已经有一个名为 name 的属性，它是 Foo 。在ES5中，name属性为 configurable：false ，因此您尝试执行的操作将不起作用，因此 TypeError：无法重新定义属性：name

If you try doing that in your browser, you will get an error, which is exactly what you are seeing. This is because the function already has a property called name and it is Foo. In ES5, the name property was configurable: false, so what you are trying to do will not work, hence the TypeError: Cannot redefine property: name error and you need to rename your static to something else.

在ES6中，名称实际上是 configurable：true ，所以你正在尝试做的最终会工作，但浏览器需要先更新自己。

In ES6, name is actually configurable: true so what you are trying to do will work eventually, but browsers need to update themselves first.

这里更大的问题是为什么你需要使用一个类。如果你正在使用所有的静态变量，你可能只是使用一个模块直接导出所有类，而不包括类。它有一个模块，导出一个创建函数，你传递一个 innerParser 方法或某事。您目前的程式码过度使用类别。

The bigger question here is why you need to use a class. If you are using all static variables, you might as well just use a module that exports everything directly without the class, and wrap it. It have a module that exports a creation function that you pass an innerParser method or something. Your current code way over-uses classes.

这篇关于Javascript es6覆盖静态属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！