ES6：访问从 Mixin 创建的类中的静态成员变量 [重复]

Question

我根据 MDN(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes) 的官方示例创建了一个类

这是我的代码

class A {
}

const Mixer = BaseClass => class extends BaseClass {
    static val = 10;
}

class B extends Mixer(A) {
    myMethod() {
    // Need some way to access the static member "val"
    }
}

如何访问“val”？

如果没有 mixin（即 B 类扩展 A，而 val 是 A 类中的静态变量），我可以完成“A.val”。

在这种情况下，Mixer.val 不起作用，并且根据我的理解 B 从匿名类扩展，因此无法通过名称访问超类。

编辑：我问错了。我真正的问题是在 Mixer 本身中访问 val 。正如我的答案所指出的那样，在 B 中访问 val 很简单。

例如

const Mixer = BaseClass => class extends BaseClass {
    static val = 10;
    myMethod2() {
        // log the val member
    }
}

Answer 1

这已经在 SO 上讨论过很多次了，但是这个案例可能需要一些解释。一般可以通过this.constructor的实例方法访问静态属性和方法：

class B extends Mixer(A) {
    myMethod() {
      console.log(this.constructor.val);
    }
}

在 this.constructor === B 的位置，但在从 B 继承的类中情况并非如此。

没有理由直接在B中引用父匿名类，因为val是通过原型链继承而来的。这就是类继承的目的。

Answer 2

es6 不支持static attribute，我不知道babel 对static val 做了什么，但事实是你测试的东西不基于 es6 规范。所以你可以使用static function来做测试

Answer 3

那是因为类字段是not yet in the ECMAScript standard。如果您 compile it with BabelJS 之后将其粘贴到浏览器控制台，您的代码可以正常工作。

class B extends Mixer(A) {
    myMethod() {
        console.log(B.val); // logs 10
    }
}

如果你需要使用 ES2015，一个快速的技巧是使用 setter 和 getter。

class A {
}

var val = 10;
const Mixer = BaseClass => class extends BaseClass {
    static get val() {
      return val;
    }

    static set val(newVal) {
      val = newVal;
    }
}

class B extends Mixer(A) {
    myMethod() {
    // Need some way to access the static member "val"
    }
}

// Use it
B.val; // 10
B.val = 15;
B.val; // 15