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"
    }
}

如何访问＆＃34; val＆＃34;？

没有mixin（即B类扩展A，而val在A类中是静态的）我本可以做到＆＃34; A.val＆＃34;。

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

编辑：我错误地提出了这个问题。我真正的问题是在混音器中访问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

这是因为类字段是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

Answer 3

es6不支持static attribute，我不知道babel对static val做了什么，但事实是你测试的不是基于es6规范。因此，您可以使用static function进行测试

ES6：在从Mixin

3 个答案: