JSデザインパターンのコンストラクタパターンの詳細説明

今回は、JSコンストラクターパターンの設計パターンと、JSコンストラクターパターンを使用する際の注意点について詳しく説明します。実際のケースを見てみましょう。

コンセプト
コンストラクターは、特定の型のオブジェクトを作成するために使用されます。コンストラクターは、使用されるオブジェクトを宣言するだけでなく、オブジェクトの最初の作成時にオブジェクトのメンバー値を設定するパラメーターを受け入れることもできます。カスタム タイプ オブジェクトの プロパティとメソッド を宣言することもできます。

役割と注意事項

特定の種類のオブジェクトを作成するために使用されます。

初めて宣言するときにオブジェクトに値を割り当てます

パラメータを渡したり、コンストラクターを自分で宣言したり、プロパティやメソッドを割り当てることができます

注:

newの使用に注意してください

との違いsingleton

基本的な使い方
JavaScriptでは、通常、コンストラクターはインスタンスを実装するために使用されると考えられていますが、JavaScriptにはクラスの概念がありませんが、特別なコンストラクターが存在します。 new オペレーションを使用すると、新しいオブジェクトを作成することと、新しいオブジェクトのメンバーがすべてコンストラクターで定義されていることを JavaScript に伝えることができます。コンストラクターでは、これは新しく作成されたオブジェクトを指します。基本的な構文は次のとおりです。

function PersonBir(name, year, month) {
    this.month = month;    this.year = year;    this.name = name;    this.output= function () {
        return this.name + ":" + this.year +"年"+ this.month+"月";
    };
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());1234567891011121314

これは関数を構築する最も簡単な方法ですが、継承するときに問題が発生すると感じませんか?プロトタイプを介して作成されたオブジェクトに出力メソッドを追加できます。次のコードを見てください

function PersonBir(name, year, month) {
    this.month = month;    this.year = year;    this.name = name；
}
PersonBir.prototype.output=function(){
     return this.name + ":" + this.year +"年"+ this.month+"月";
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());123456789101112

このようにして、出力された単一のインスタンスを共有して、コンストラクターに名前を付けるときに関数を使用します。通常の機能と区別するために、名前は大文字で表記されています。

new 演算子の使用を強制する

コンストラクターで new 演算子を使用するために、次のコードを見てみましょう。目的を達成するために、この値の instanceof が personBir であるかどうかを判断して、new 演算子の使用を強制します。 。

function PersonBir(name, year, month) {
    //核心代码，如果为假，就创建一个新的实例返回。
    if(!(this instanceof PersonBir)){        return new PersonBir(name, year, month);
    }    this.month = month;    this.year = year;    this.name = name；
}
PersonBir.prototype.output=function(){
     return this.name + ":" + this.year +"年"+ this.month+"月";
}var ming= new PersonBir("小明", 1998, 5);var gang= new PersonBir("小刚", 2000, 4);
console.log(ming.output());
console.log(gang.output());

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

js 設計パターン - シングルトン パターンの使用

フロントエンドでモジュール性を使用する必要があるのはなぜですか?

一般的な CSS 互換性問題の解決策

以上がJSデザインパターンのコンストラクタパターンの詳細説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。