Question

自从我开始使用ES6以来，我一直在使用扩展声明class ClassB extends ClassA {}来扩展类，因为最近这是我见过它的唯一方法。

前几天在阅读Yeoman文档时，我注意到他们正在扩展课程module.exports = class extends ClassA {}。

我认为这些声明必须是说出完全相同的事情的不同方式。我测试了以下代码以证实我的怀疑，但它并不像我希望的那样清晰：

class ClassA {
    constructor(width) {
        this.width = width
    }
}

let ClassB = class extends ClassA {
    constructor(width, height) {
        super(width)
        this.height = height
    }
}

class ClassC extends ClassA {
    constructor(width, height) {
        super(width)
        this.height = height
    }
}

let instanceB = new ClassB(10, 10)
let instanceC = new ClassC(10, 10)

当我在chrome中检查演示时，我注意到变量instanceB和instanceC的构造函数略有不同：

- instanceB: ClassB
    - __proto__: ClassA
        - constructor: class extends
- instanceC: ClassC
    - __proto__: ClassA
        - constructor: class ClassC

我的问题是这些扩展声明是否完全相同，即使它们在检查器中的描述略有不同？

Answer 1

它们对于所有实际目的都是一样的。考虑

module.exports = class extends ClassA {}
let ClassB = class extends ClassA {}
class ClassC extends ClassA

然后

（1）没有.name property，而ClassB.name == "ClassB"和ClassC.name == "ClassC"
（3）将在.toString() method返回的字符串中包含名称，而其他两个则返回"class extends ClassA {}"（这似乎是Chrome devtools检查的基础，而我考虑只显示class extends一个错误并期望它发生变化 - 对于未命名的类可能只是class

Answer 2

这是因为您将其分配给变量。尝试 ob 代替： class classB extends classA

类之间的差异扩展了Javascript中的声明

2 个答案: