如何在 JavaScript 中扩展一个类答案

【问题标题】：How to extend a class in JavaScript如何在 JavaScript 中扩展一个类
【发布时间】：2013-04-27 05:20:49
【问题描述】：

我正在开发一个用 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);

【问题讨论】：

标签： javascript oop object inheritance extends

【解决方案1】：

可以通过不同的方式扩展类。扩展类最简单的方法是使用 Object.create 方法。这是用于achieve abstraction（链接到我的博客）的常用方法。下面我们举一个 Object.create 方法的例子。

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

【讨论】：

【解决方案2】：

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

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

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

    that.myPublicMethod=function(){

    }
    return that;

    }

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

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

【讨论】：

【解决方案3】：

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

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

【讨论】：

【解决方案4】：

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

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

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

-- 编辑--

您可能更喜欢这个：Javascript inheritance: call super-constructor or use prototype chain?

【讨论】：

【解决方案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!

【讨论】：