JavaScript构造函数在“子类”中，正确的符号？

我想与JavaScript继承握手。我的示例代码开头是这样的：JavaScript构造函数在“子类”中，正确的符号？

var example = example || {}; 
example.Classes = {}; 

(function() { 
    var example = example || {}; 
    example.Classes = {}; 

    var privateVar = 25; 
    function Superclass() { 
     this.x = privateVar; 
    } 
    Superclass.prototype = { 
     move: function(x){ 
      this.x += x; 
      console.log("Superclass move",this.x); 
     }, 
     dance: function(x){ 
      this.x += x*2; 
     } 
    }; 

    function Subclass() { 
     Superclass.apply(this, arguments); 
     this.y = 0; 
    }; 
    Subclass.prototype = Object.create(Superclass.prototype); 
    Subclass.prototype.constructor = Subclass;

这是成功的延续：

Subclass.prototype.dance = function(x, y) { 
     this.x -= (x + privateVar); 
     this.y -= y; 
     console.log("Subclass dance", this.x, this.y) 
    }; 
    example.Classes.Superclass = Superclass; 
    example.Classes.Subclass = Subclass; 
    window.example.Classes = example.Classes; 
}()); 

var success = new example.Classes.Subclass(); 
success.dance(5,4); 
success.move(6);

控制台输出：子类舞蹈-5 -4
控制台输出：超类招1

而现在失败的延续 - 这里有什么不对？为什么我不能使用这种写子类构造函数的方式？

Subclass.prototype = { 
     dance: function(x, y) { 
      this.x -= (x + privateVar); 
      this.y -= y; 
      console.log("Subclass dance", this.x, this.y) 
     } 
    }; 

    example.Classes.Superclass = Superclass; 
    example.Classes.Subclass = Subclass; 
    window.example.Classes = example.Classes; 
}()); 

var failure = new example.Classes.Subclass(); 
failure.dance(5,4); 
failure.move(6);

控制台输出：子类舞蹈-5 -4
控制台输出：ERROR：failure.move不是一个函数

来源

2016-09-21 Daniela

我建议阅读[MDN上的此页面]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain）。你不应该需要所有的'Classes' /'Subclass'''' Superclass' ... –

所以我的问题归结为\t'Subclass.prototype.dance = function（x，y）{ };'和 'Subclass.prototype = {dance：function（）{}};'？ – Daniela

Why can't I use this way of writing the subclass constructor functions?

因为你吹走曾经是在对象Subclass.prototype属性（来自Object.create(Superclass.prototype)的属性）和替换它与一个对象的原型是Object.prototype只有一个属性，dance。

一旦你创建了Subclass.prototype对象，你总是希望增加它像你一样最初：

Subclass.prototype.dance = /*...*/;

不更换它：

// Not this 
Subclass.prototype = { dance: /*...*/ };

ES2015加入一个方便函数用于将一个对象（或其中的一系列对象）的属性合并到目标对象中：Object.assign。对于较老的JavaScript引擎，它可以被多填充（大部分）。利用这一点，你可以这样做：

Object.assign(Subclass.prototype, { 
    dance: function dance() { /* ... */ }, 
    skip: function skip() { /* ... */ }, 
    jump: function jump() { /* ... */ } 
});

话虽如此，这里在2016年，我会建议使用class功能在ES2015加入（如果必要的话transpiling老年JavaScript引擎）：

class Superclass { 
    constructor() { 
     //... 
    } 

    method() { 
     // ... 
} 

class Subclass extends Superclass { 
    constructor() { 
     super(); 
     // ... 
    } 

    anotherMethod() { 
     // ... 
    } 
}

来源

2016-09-21 17:24:56

谢谢，这非常有帮助！ – Daniela

JavaScript构造函数在“子类”中，正确的符号？

回答

相关问题