javascript - 访问父类(super class)上的类字段

我有一个包含以下代码的文件：

class Animal {
    doSomething = () => {
        return 'Hi.';
    };
}

class Dog extends Animal {
    doSomething = () => {
        return super.doSomething() + ' Woof!';
    };
}

console.log(new Dog().doSomething());

注意：尝试运行上面的代码段可能不会起作用，因为我不知道如何使用Babal设置来使其运行。

无论如何，当我使用Babel编译它并在Node中运行它时，出现以下错误：

/Users/elias/src/classFieldTest/build/classFieldTest.js:15
            return super.doSomething() + ' Woof!';
                         ^

TypeError: (intermediate value).doSomething is not a function
    at Dog.doSomething (/Users/elias/src/classFieldTest/build/classFieldTest.js:15:26)
    at Object.<anonymous> (/Users/elias/src/classFieldTest/build/classFieldTest.js:21:23)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Function.Module.runMain (module.js:693:10)
    at startup (bootstrap_node.js:188:16)
    at bootstrap_node.js:609:3

我将Babel 6.26.0和stage-2预设以及Node 8.11.1一起使用。如果有人在意，我可以显示我正在使用的命令。

为什么会这样呢？我猜想super不能用于访问类字段，但是我应该怎么做？如果我将doSomething的Animal方法更改为传统方法（doSomething() { return 'Hi.'; }），则可以使用，但是我宁愿避免使用传统方法，因为它们会重新定义this及其引起的所有混乱。

有什么方法可以访问超类的类字段？

最佳答案

为什么会这样呢？我猜不能使用超级访问类字段


是。类字段是实例属性，但是super尝试访问超类的原型对象上的属性。您的Animal类根本没有doSomething方法-相反，每个Animal对象都有一个包含绑定函数的属性。


  但是我该怎么办？如果我将其更改为传统方法，它会起作用


是的，您应该做到这一点。这就是方法和super的工作方式。

避免使用箭头功能when you don't need them，尤其是when they don't work。还可以查看Arrow Functions in Class Properties Might Not Be As Great As We Think。


  有什么方法可以访问超类的类字段？


是的-它是一个实例属性，可以在覆盖它之前在构造函数中访问它：

class Animal {
    constructor() {
        this.doSomething = () => {
             return 'Hi.';
        };
    }
}

class Dog extends Animal {
    constructor() {
        super();
        const superDoSomething = this.doSomething;
        this.doSomething = () => {
            return superDoSomething() + ' Woof!';
        };
    }
}

或者，使用类字段proposal而不使用显式构造函数：

class Animal {
    doSomething = () => {
        return 'Hi.';
    }
}

class Dog extends Animal {
    doSomething = (superDoSomething => () => {
        return superDoSomething() + ' Woof!';
    })(this.doSomething)
}