如何在JavaScript中扩展类

如何在JavaScript中扩展类,javascript,oop,object,inheritance,extends,Javascript,Oop,Object,Inheritance,Extends,我正在开发一款内置JavaScript的国际象棋游戏。我采用了面向对象的方法,在处理JavaScript的继承时遇到了一些困难。我希望有一个“Piece”抽象类,它包含一些字段和基本的getter/setter,比如这个Piece是黑色的还是白色的。然后,我想为每种类型的工件创建类,我可以这样实例化: var pieceOne = new Pawn(); Pawn()应该拥有Piece的所有字段和方法,但有自己的移动方法,以及其他字段(例如它是否已经移动,因为这对大多数棋子来说并不重要)。这是

我正在开发一款内置JavaScript的国际象棋游戏。我采用了面向对象的方法,在处理JavaScript的继承时遇到了一些困难。我希望有一个“Piece”抽象类,它包含一些字段和基本的getter/setter,比如这个Piece是黑色的还是白色的。然后,我想为每种类型的工件创建类,我可以这样实例化:

var pieceOne = new Pawn();
Pawn()应该拥有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;
};
我知道如果我要为每种类型的工件创建一个子类,我可能会删除“type”字段,但是我怎么能创建一个Pawn子类呢?像这样的

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

我相信这只是将特定片段构造函数的原型设置为
片段的实例的问题。例如:

Pawn.prototype = new Piece("", false, false);
但是,这不会在每次实例化新的
Pawn
时调用
Piece
(超级)构造函数,因此您必须从
Pawn
构造函数手动分配颜色、类型等:

--编辑--


您可能更喜欢这样:

如果您愿意在JS上采用面向对象的方法,我建议您遵循power构造函数模式

基本上,您有一个函数可以为您创建对象,并利用闭包隐藏内部属性(字段或方法)

然后,您只需调用方法myObject(),就会得到这种类型的新对象


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

您可以从
Pawn
调用
Piece
的构造函数,并让该构造函数对
Pawn
实例进行操作:

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

扩展类可以用不同的方式完成。扩展类的最简单方法是使用Object.create方法。这是常用的方法,用于(链接到我的博客)。让我们给出Object.create方法的一个示例,如下所示

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

用法:

var obj = new MyClass("Hello World!");
console.log( obj.someMethod() ); // Hello World!
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!