javascript - 为什么我的类原型(prototype)不起作用？

Question

为了构建我的 JavaScript 代码，我想使用 classes ，ES6 新增的原型(prototype)继承语法糖。不过我遇到了麻烦:我的原型(prototype)方法似乎没有按预期工作，这让我觉得我可能对 JavaScript 类和/或它们的工作方式存在根本性的误解。

采用以下代码，它声明了一个传统的构造函数 Cat 并修改了它的原型(prototype)，以及一个 ES6 类 Dog，其中定义了一个原型(prototype)方法。

// Traditional Cat Constructor
// ===========================
function Cat(name) {
    this.name  = name;
    this.sound = "Meow.";
}

Cat.prototype.speak = function() {
    console.log(this.sound || "I don't make a sound.");
};


// Dog via ES6 Class
// =================
class Dog {
    constructor(name) {
        this.name = name;
        this.sound = "Woof!";
    }

    speak() {
        console.log(this.sound);
    }
}

var cat = new Cat("Bella");
var dog = new Dog("Sparky");

---

在 NodeJS(使用 4.4.2 和 6.0.0-pre 测试)中，当我尝试获取 Dog 实例的原型(prototype)时，我得到一个空的对象，但我仍然能够在实例上调用原型(prototype)方法。

Object.getPrototypeOf(cat);
// -> Cat { speak: [Function] }

Object.getPrototypeOf(dog);
// -> Dog {}

cat.speak();
// -> Meow.

dog.speak();
// -> Woof!

---

在 Google Chrome 中，我希望结果相同(因为 Node 使用其引擎)，但我却得到了预期的结果:

Object.getPrototypeOf(cat);
// -> Object {}
// ->     constructor: function Cat(name)
// ->     speak: function()
// ->     __proto__: Object

Object.getPrototypeOf(dog);
// -> Object {}
// ->     constructor: function(name)
// ->     speak: function()
// ->     __proto__: Object

---

我在 Node 中遇到一个错误，说我在类中定义的原型(prototype)方法不是它们类实例的函数，这是我注意到这个的唯一原因，但不幸的是现在我似乎无法重现这个问题。

无论如何，上面的内容并不正确，是否有任何解释为什么这段代码以这种方式运行？

Answer 1

Why are my class prototypes not working?

仅仅因为输出不是您预期的那样并不意味着它没有工作。 Node REPL 和 console 都不是标准化的。实现可以完全自由地输出他们想要的任何内容。

真正知道某物是否“有效”的唯一方法是使用它。所以尝试调用 dog.speak()。

Regardless, the above does not seams right, is there any explanation for why this code is behaving in this way?

类方法是不可枚举 属性，因此它们不会出现在 Node 输出中。简化示例:

> var foo = {};
undefined
> Object.defineProperty(foo, 'bar', {value: 42, enumerable: false});
{}
> console.log(foo);
{}
undefined
> foo.bar
42
>

关于 Chrome 输出，您似乎扩展了对象。 Chrome 始终显示可枚举和不可枚举的属性。

> var foo = {};
  undefined
> Object.defineProperty(foo, 'bar', {value: 42, enumerable: false});
  Object {bar: 42}
> console.dir(foo);
  Object
    bar: 42
    __proto__: Object
  undefined

似乎 Chrome 在夏季也显示了不可枚举的属性。然而，即使 Chrome 和 Node 共享相同的引擎，它们可能不会共享相同的 console 或输出生成逻辑。