24

JavaScript でクラスのような動作を得るにはいくつかの方法がありますが、最も一般的なのは次のようなプロトタイプ ベースのようです。

function Vector(x, y, x) {
    this.x = x;
    this.y = y;
    this.z = z;
    return this;
}

Vector.prototype.length = function () { return Math.sqrt(this.x * this.x ... ); }

と同様の閉鎖ベースのアプローチ

function Vector(x, y, z) {
    this.length = function() { return Math.sqrt(x * x + ...); }
}

さまざまな理由で後者の方が高速ですが、私はプロトタイプ バージョンを見たことがあり (そして私は頻繁に書いています)、他の人が何をしているのかについて興味がありました。

4

7 に答える 7

12

クラスのすべてのインスタンスがメソッドの同じコピーを共有するため、関数をプロトタイプに割り当てる方が優れています (パブリック メソッドの場合)。2 番目の例のようにコンストラクター内で関数を割り当てると、新しいインスタンスを作成するたびに、コンストラクターは長さ関数の新しいコピーを作成し、それをその 1 つのインスタンスだけに割り当てます。

ただし、この後者の手法は、各コピーに独自のコピーを持たせたい場合に役立ちます。その主な用途は、コンストラクター内で宣言され、クロージャーメカニズムを介して継承されるプライベート変数にアクセスできるプライベート/特権メソッドを実行することです。

Douglas Crockford が良い要約をしています。

于 2008-08-09T02:05:33.840 に答える
5

プロトタイプへのオブジェクト リテラル アプローチもあります。

var Vector = function(){};

Vector.prototype = {
  init:function(x,y,z) {
    this.x = x;
    this.y = y;
    this.z = z;
  },
  length:function() {
    return Math.sqrt(x * x + ...);
  }
};

var v1 = new Vector();
v1.init(1,2,3);
于 2008-09-22T02:43:19.413 に答える
3

幸いなことに、素敵なラッパーを提供するprototype.jsを使用することができました。だからあなたはこれを行うことができます：

var Person = Class.create({
    initialize: function(name) {
        this.name = name;
    },
    say: function(message) {
        return this.name + ': ' + message;
    }
});

Prototype.jsドキュメンテーション: クラスと継承の定義

于 2008-08-09T02:09:04.673 に答える
2

うーん、これに関しては専門家の意見はありません。コードを管理しやすくするという理由だけで、私は通常、クロージャーベースのアプローチを使用することになります。しかし、大量のコード行を持つメソッドのプロトタイプを使用していることに気づきました。

于 2008-08-09T01:12:26.863 に答える
2

次の選択肢もあります。

function Vector(x, y, z) {
  function length() {
    return Math.sqrt(x * x + ...);
  }
}

これはおそらく例 2 と同じくらい遅いですが、より Java/C# に似ており、もう少し明示的です。

于 2008-08-09T01:32:17.120 に答える
1

JavaScript にはクラスがありません。

ただし、オブジェクトがあります。JavaScript でオブジェクトを作成するのにクラスは必要ありません。たとえば、 new で呼び出すことができるコンストラクター関数があります。

var james = new Person();

以下を使用して、クラスのような動作をシミュレートできます。

プロトタイプの例:

function Car (type) {
    this.type = type;
    this.color = "red";
}

Car.prototype.getInfo = function() {
    return this.color + ' ' + this.type + ' car';
};

オブジェクトリテラルの例

var car = {
    type: "honda",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' car';
    }
}
于 2013-11-11T16:34:23.253 に答える
1

私は、このためにJohn Resig のライブラリを使用することの大ファンです。軽量で簡単で、「通常の」オブジェクト指向スタイルに慣れている場合は、その使用方法を既に知っています。

于 2010-07-26T19:52:55.290 に答える