为什么我的班级原型不起作用？

Question

为了构建我的JavaScript代码,我想使用类,ES6的新原型继承的语法糖.我遇到了麻烦:似乎我的原型方法没有按预期工作,这让我觉得我可能对JavaScript类有一个基本的误解,和/或它们是如何工作的.

采用以下代码,声明传统构造函数Cat并修改其原型,以及Dog在其中定义的原型方法的ES6类.

// 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方法.

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

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

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

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

---

在谷歌浏览器中,我希望结果是相同的(因为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中遇到一个错误,说我在类中定义的原型方法不是它们类的实例的函数,这是我注意到这一点的唯一原因,但不幸的是现在我似乎无法重现那个问题.

无论如何,上面没有正确的接缝,是否有任何解释为什么这个代码以这种方式表现？

Answer 1

为什么我的班级原型不起作用？

只是因为输出不是你的预期并不意味着它不起作用.节点REPL既不console是标准化的也不是标准化的.实现完全可以随意输出他们想要的任何内容.

真正了解某些东西是否"有效"的唯一方法就是使用它.所以试着打电话dog.speak().

无论如何,上面没有正确的接缝,是否有任何解释为什么这个代码以这种方式表现？

类方法是不可枚举的属性,因此它们不会显示在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或输出生成.