JavaScript 是一种基于原型(prototype)的语言，但它能够模仿基于类的面向对象语言的某些功能。例如，JavaScript 没有公共(public)成员和私有(private)成员的概念，但通过闭包的魔力，它仍然可以提供相同的功能。类似地，方法重载、接口(interface)、 namespace 和抽象类都可以以一种或另一种方式添加。

最近，由于我一直在使用 JavaScript 进行编程，我觉得我正在尝试将它变成一种基于类的语言，而不是按照它应该使用的方式使用它。似乎我在试图强制语言符合我的习惯。

以下是我最近写的一些 JavaScript 代码。它的目的是抽象出一些涉及绘制到 HTML5 Canvas 元素的工作。

/*
Defines the Drawing namespace.
*/
var Drawing = {};

/*
Abstract base which represents an element to be drawn on the screen.
@param The graphical context in which this Node is drawn.
@param position The position of the center of this Node.
*/
Drawing.Node = function(context, position) {

    return {

        /*
        The method which performs the actual drawing code for this Node.  This method must be overridden in any subclasses of Node.
        */
        draw: function() {
            throw Exception.MethodNotOverridden;
        },

        /*
        Returns the graphical context for this Node.
        @return The graphical context for this Node.
        */
        getContext: function() {
            return context;
        },

        /*
        Returns the position of this Node.
        @return The position of this Node.
        */
        getPosition: function() {
            return position;
        },

        /*
        Sets the position of this Node.
        @param thePosition The position of this Node.
        */
        setPosition: function(thePosition) {
            position = thePosition;
        }
    };
}

/*
Define the shape namespace.
*/
var Shape = {};

/*
A circle shape implementation of Drawing.Node.
@param context The graphical context in which this Circle is drawn.
@param position The center of this Circle.
@param radius The radius of this circle.
@praram color The color of this circle.
*/
Shape.Circle = function(context, position, radius, color) {

    //check the parameters
    if (radius < 0)
        throw Exception.InvalidArgument;

    var node = Drawing.Node(context, position);

    //overload the node drawing method
    node.draw = function() {

        var context = this.getContext();
        var position = this.getPosition();

        context.fillStyle = color;
        context.beginPath();
        context.arc(position.x, position.y, radius, 0, Math.PI*2, true);
        context.closePath();
        context.fill();
    }

    /*
    Returns the radius of this Circle.
    @return The radius of this Circle.
    */
    node.getRadius = function() {
        return radius;
    };

    /*
    Sets the radius of this Circle.
    @param theRadius The new radius of this circle.
    */
    node.setRadius = function(theRadius) {
        radius = theRadius;
    };

    /*
    Returns the color of this Circle.
    @return The color of this Circle.
    */
    node.getColor = function() {
        return color;
    };

    /*
    Sets the color of this Circle.
    @param theColor The new color of this Circle.
    */
    node.setColor = function(theColor) {
        color = theColor;
    };

    //return the node
    return node;
};

该代码的工作方式与 Shape.Circle 的用户应有的完全一样，但感觉就像是用 Duct Tape 结合在一起的。有人可以对此提供一些见解吗？

最佳答案

这将是一个意见驱动的问题。但我会投入我的 $.02。

tl/dr:不要太担心这个。 JavaScript 非常灵活，可以支持多种做事方式。井井有条就是井井有条。你可能没事。

更详细的回答:

1) 在有意义的地方使用类:问题域适合类/类层次结构建模的地方。一个问题领域，你有各种各样的形状对象，这些形状对象具有从基类和其他多态方法继承的通用方法......好吧，这是(字面上)类层次结构明显且可能有用的案例的教科书示例，并且以类为中心的代码在那里是有意义的，并且没有任何问题。

2) 您甚至不必使用闭包/模块模式/任何东西。当您编写类时，大多数时候使用 JavaScript 中可用的 native 类功能并没有错——只需定义构造函数，然后为构造函数定义原型(prototype)对象并将您的方法放在上面。当您想从该类继承时，将子类的原型(prototype)对象分配给您从中派生的类的实例。

(例如:

Drawing.Node = (function() {

    var Node = function (context,position) {
        this.context = context;
        this.position = position;
    }

    Node.prototype = {
        draw: function() { throw Exception.MethodNotOverridden; },
        getContext: function() { return this.context; },
        getPosition: function() { return this.position; },
        setPosition: function(newPosition) { this.position = newPosition; }
    };

    return Node;
})();

Shape.Circle = (function () {

    var Circle = // Circle constructor function

    Circle.prototype = new Draw.Node;

    Circle.prototype.overriddenmethod1 = function () {

    }

    Circle.prototype.overriddenmethod2 = function () {

    }

    return Circle;
})()

)

私有(private)成员/方法呢？这是一种观点，但大多数时候，我认为隐私作为一种运行时强制机制被过度使用甚至滥用。开发人员有很多工作要做；他们可能宁愿不注意任何给定抽象的内部结构，除非它泄漏了有害的东西。如果你的类不会引起问题，抛出/返回有用的错误，提供真正有用的方法，并且有足够的文档记录，你就不需要任何类型的隐私强制机制，因为每个人都会对你的类所节省的工作感到非常满意他们永远不会向里面窥视。如果您的类(class)不符合该标准，那么，缺乏隐私执行机制并不是您的真正问题。

有一个异常(exception)，那就是当您在一个页面/应用程序中混合使用来自不同(且通常不受信任)来源的 JavaScript 代码时。此时，出于安全原因，您有时必须仔细考虑在您的代码和您的代码单独访问的给定范围内隔离一些关键功能/方法。

编辑/附录

在回答关于为什么我有那些立即评估的函数的问题时，考虑这种编写 Drawing.Node 定义的替代方法:

Drawing.Node = function (context,position) {
    this.context = context;
    this.position = position;
}

Drawing.Node.prototype = {
    draw: function() { throw Exception.MethodNotOverridden; },
    getContext: function() { return this.context; },
    getPosition: function() { return this.position; },
    setPosition: function(newPosition) { this.position = newPosition; }
};

这与上面的代码完全相同。恕我直言，它也是完全可以接受的，并且可能更清晰一些，不那么棘手。

另一方面，我发现将所有这些都放在立即执行的匿名函数的范围内给我至少两个优势:

1. 如果我确实决定我需要定义任何私有(private)方法或以其他方式进行一些仅与该特定类定义相关的设置工作，它会为我提供一个很好的私有(private)范围来工作。

2. 如果我决定需要将 Node 在命名空间对象层次结构中的位置移动到其他地方，如果与其定义相关的所有内容都集中在一个方便的位置，那会比较方便。

有时这些优势很小。有时它们更引人注目。 YMMV。

关于javascript - 将基于类的设计应用于 JavaScript 程序是否是一种不好的做法？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4487754/