如何在JavaScript中扩展类

Question

我正在研究用JavaScript构建的国际象棋游戏。 我正在采用面向对象的方法，并且在使用JavaScript的继承方面遇到了一些困难。 我希望有一个“Piece”抽象类，它包含一些字段和基本的getter / setter，例如这件黑色或白色。 然后，我希望为每种类型的片段提供类，我可以像这样实例化：

var pieceOne = new Pawn();

Pawn（）应该具有Piece的所有字段和方法，但是有自己的移动方法和其他字段（例如它是否已移动，因为这对大多数部分无关紧要）。 这是我目前的Piece类：

//This object specifies basic information about pieces.
"use strict";
function Piece(color, type, captured, hasMoved) {    
    this.color = color;
    this.type = type;
    this.captured = captured;
    this.hasMoved = hasMoved;
    this.image = color + "_" + type + ".svg";
}
Piece.prototype.getImage = function getImage(){
    return this.image;
}
Piece.prototype.isCaptured = function isCaptured(){
    return this.captured;
};

我知道如果我要为每种作品创建一个子类，我可能会消除“类型”字段，但是我怎样才能创建一个Pawn子类？ 像这样的东西？

function Pawn() = new Piece(color, captured, hasMoved);
Pawn.prototype.getLegalMoves = function getLegalMoves(){
    //return legal moves
}
var pieceOne = new Pawn("black", false, false);

Answer 1

扩展课程可以通过不同方式完成。 扩展类的最简单方法是使用Object.create方法。 这是用于实现抽象的常用方法（链接到我的博客）。 让我们举一个Object.create方法的例子，如下所示。

var Logger = { log : function(log){} } 
var ConsoleLogger = function() {}; 
ConsoleLogger.prototype = Object.create(Logger);

Answer 2

我相信这只是将特定部分构造函数的原型设置为Piece的实例。 例如：

Pawn.prototype = new Piece("", false, false);

但是，每次实例化一个新的Pawn时，这都不会调用Piece （超级）构造函数，因此您必须从Pawn构造函数手动指定颜色，类型等：

- 编辑 -

您可能更喜欢这样： Javascript继承：调用超级构造函数或使用原型链？

Answer 3

如果您愿意在JS上采用面向对象的方法，我建议您遵循power powerctor模式。

基本上你有一个为你创建对象的函数，并利用闭包来隐藏内部属性（字段或方法）。

 function myObject(){
    var that={};
    var myPrivateField;
    var myPrivateFunction=function(){
    }

    that.myPublicMethod=function(){

    }
    return that;

    }

然后你可以调用方法myObject（），你将得到一个这种类型的新对象。

您可以通过调用另一个对象的幂构造函数来扩展此示例以使用继承，然后使用对象扩充。 看看Douglas Crockford的寄生遗传的例子。

Answer 4

您可以从Pawn调用Piece的构造函数，并让该构造函数在Pawn实例上运行：

function Pawn(/* args... */) {
    Piece.call(this, color, type, captured, hasMoved);
    /* Pawn-specific constructor code... */
}

Answer 5

看看这个： https ： //github.com/haroldiedema/joii

var BaseClass = function() 
{
    this.some_var = "foobar";

    /**
     * @return string
     */
    this.someMethod = function() {
        return this.some_var;
    }
};

var MyClass = new Class({ extends: BaseClass }, function()
{
    /**
     * @param string value
     */
    this.__construct = function(value)
    {
        this.some_var = value;
    }

})

用法：

var obj = new MyClass("Hello World!");
console.log( obj.someMethod() ); // Hello World!