1

私はJavascriptとオブジェクト指向プログラミング全般に不慣れです。JS OOP コードを記述する際に、ベスト プラクティスに従っているかどうかを知りたいです。

ここでは、_name という名前のクラスを作成し、いくつかのプロパティとオブジェクト this.details を指定しました。次に、プロトタイピングを使用してクラスのメソッドを作成します。

//define _name class (I use _ to easily recognize classes)
function _name () {
    this.firstName = '';
    this.lastName = '';
    this.middleName = '';
    this.details = {
        eyeColor: '',
        hairColor: ''
    }
}

//begin _name methods

_name.prototype.getFullName = function() {
    return this.firstName + ' ' + this.middleName + ' ' + this.lastName;
}
_name.prototype.setFirstName = function(firstName) {
    if ($.trim(firstName).length && typeof firstName != 'not_defined') {
        this.firstName = firstName;
    } else {
        alert('Please enter a valid first name.');
    }
}
_name.prototype.setLastName = function(lastName) {
    if ($.trim(lastName).length && typeof lastName != 'not_defined') {
        this.lastName = lastName;
    } else {
        alert('Please enter a valid last name.');
    }
}
_name.prototype.setMiddleName = function(middleName) {
    if ($.trim(middleName).length && typeof middleName != 'not_defined') {
        this.middleName = middleName;
    } else {
        alert('Please enter a valid middle name.');
    }
}
_name.prototype.setHairColor = function(hairColor) {
    this.details.hairColor = hairColor;
}
_name.prototype.setEyeColor = function(eyeColor) {
    this.details.eyeColor = eyeColor;
}

//end _name methods

var personOne = new _name();
personOne.setFirstName('John');
personOne.setLastName('Doe');
personOne.setMiddleName('Barry');
personOne.setEyeColor('Brown');
personOne.setHairColor('Black');
document.write(personOne.getFullName());
document.write(personOne.details.eyeColor);
document.write(personOne.details.hairColor);
4

2 に答える 2

3

全体像では、はい、あなたはうまくやっています。良いですね。:-)詳細と展望については、SOに関するこの他の回答の例を検討してください。

いくつかのポインタは、OOPに関連するものではなく、JavaScriptに関連するものです。

  1. JavaScriptの圧倒的な慣習は、コンストラクター関数（your _name）が最初にキャップされていることです（例：NameまたはDate）RegExp。

  2. フォームで割り当てられたさまざまな関数は、_name.prototype.setLastName = function() { ... }名前を持つプロパティに割り当てられた無名関数です。関数に適切な名前を付けると、ツールが役立ちます。一部のエンジンは、関数に名前を付けなくてもそれを理解できるほど賢いですが、他のエンジンには適切な名前が必要です。例については上記のリンクを参照してください、および/または匿名匿名。

  3. すべての関数割り当てでセミコロンが自動的に挿入されるというホラーに依存しています。_name.prototype.setLastName = function() { ... }は、の後にセミコロンで終わる必要があります}。ルールを学び、常にセミコロンを明示的に指定することをお勧めします。エンジンが推測しなければならないとき、それは間違って推測する可能性があり、それらを除外すると縮小/圧縮/パッキングが困難になります。

  4. _name.prototype.xyz = ...いたるところに書き込むのではなく、スコープ関数を使用_name.prototypeして、より単純なシンボルにキャッシュすることを検討してください。例：

    (function(p) {
    p.setLastName = function() {
        // ...
    };

    p.xyz = function() {
        // ...
    };
})(_name.prototype);

    ...またはそれ以上のヘルパー関数を使用します。キーストロークとスクリプトサイズを削減するためだけに。

しかし、繰り返しになりますが、概して、はい、あなたは正しい方向に進んでいます。

もっと読む：

于 2012-06-28T23:23:35.463 に答える
0

いくつかのコメント:

クラスを簡単に認識できるように _ を使用します

標準では、コンストラクター関数には大文字の名前を使用します。アンダースコアは、変数またはプロパティのプライバシーを暗示するために使用されます。つまり、それらは公開されていますが、使用すべきではありません。

var personOne = new _name();

personOne.setFirstName('John');

personOne.set...

通常、コンストラクターに引数を使用します。

function Name (first, last, middle, eye, hair) {
    this.firstName = first;
    this.lastName = last;
    this.middleName = middle;
    this.details = {
        eyeColor: eye,
        hairColor: hair
    }
}

var personOne = new Name('John', 'Doe', 'Barry', 'Brown', 'Black');

セッターは通常、初期化時に一度だけ呼び出されるため、コードをコンストラクター関数に移動できます。プロパティを変更可能にする場合でも、コンストラクターから検証ロジックを使用してセッター関数を呼び出すことができます。

typeof middleName != 'not_defined'

typeof値のない変数の演算子の結果は です"undefined"。また、トリミング前に確認する必要があります。

また、一般的なコード設計に欠陥がある可能性もあります。名、ミドルネーム、姓に同じ条件を使用します。実際にvalidateStringは、単一のセッター (DRY コード) から呼び出すことができる独自の関数にそれらを移動する必要があります。同様に、検証関数は入力内容に関するフィードバックをユーザーに与えるべきではなく、単にfalse「無効」を返す必要があります。ユーザーの操作は、データ構造化モジュールではなく、入力も処理するモジュールによって行われる必要があります。

于 2012-06-28T23:20:57.890 に答える