创建Javascript类的正确方法是什么？

Question

我正在试图弄清楚如何正确构建我的Javascript类(或单例对象).

var obj = new Object();
obj.foo = 'bar';
obj.method = function() { ...}

var obj = {
    foo : 'bar',
    method : function() { ...}
}

var obj = function(){}
obj.prototype = {
    foo : 'bar',
    method: function() { ... }
}

我希望能够设置几个属性并分配可用的方法.我也想能够使用的东西像混入上的对象,所以我可以用的东西像延长这些对象的事件.

Answer 1

我正在试图弄清楚如何正确构建我的Javascript类(或单例对象).

这些("类"和单例对象)之间存在很大差异.你的前几个例子是一次性对象(单身人士).您的第三个(最后一个)示例创建了一个构造函数,该函数允许您创建共享相同原型的多个对象.我会建议增强了prototype在构造函数属性,而不是取代它,你在做什么,例如:

var Thingy = function() {   // Or use a function declaration rather than expression
    // Optional initialization code here
};
Thingy.prototype.foo = 'bar';
Thingy.prototype.method = function() {
    // Method code here
};

(按照惯例,构造函数以大写字母开头.)

你使用的(单例或构造函数)取决于你需要什么.

从ES2015(又名"ES6")开始,它更简单,虽然没有新的语法来定义非方法原型属性(你的foo); 一旦这个提案向前推进,可能会出现在ES2017或ES2018中,但直到那时:

class Thingy {
    constructor() {
        // Optional initialization code here
    }
    method() {
    // Method code here
    }
}
Thingy.prototype.foo = 'bar';

如果你需要进入继承层次结构,在旧的ES5语法中,涉及到相当多的管道:

var Base = function() {
};
Base.prototype.method = function(arg1) {
    // ...
};

var Derived = function() {
    Base.call(this);
};
Derived.prototype = Object.create(Base.prototype);
Derived.prototype.constructor = Derived;
Derived.prototype.method = function(arg1) {
    // Using Base's `method`, if desired, is a bit ugly:
    Base.prototype.method.call(this, arg1);
};

...这就是为什么你曾经看过踩过的图书馆,比如Prototype的Class东西,或者我自己的Lineage ; 那些已经过时的ES2015语法已经过时了,这简直太容易了:

class Base {
    method(arg1) {
        // ...
    }
}
class Derived extends Base {
    method(arg1) {
        // Use's the superclass's `method`, if desired, is easy:
        super.method(arg1);
    }
}

重新提出问题的标题:

创建Javascript类的正确方法是什么？

有几种同样正确的方法可以在JavaScript中创建对象的"类",因为JavaScript是一种非常灵活的语言.有标准的构造函数,"构建器"函数Object.create(在启用ES5的环境中),它允许您进行更直接的原型继承,以及其他几个.JavaScript的一大优点是你可以选择你的"课堂"风格.