JAvascriptオブジェクト向け(ファクトリモード、コンストラクション関数モード、プロトタイプモード、ブレンドモード、ダイナミックプロトタイプモード)

オブジェクト向けは、プログラム内のキーモジュールをオブジェクトと見なすことができ、モジュールには属性と方法があります.このように,いくつかの属性や方法をカプセル化すれば,後日の使用が非常に便利になり,煩雑な重複作業を避けることができる.次にJSでのオブジェクト向けの実装について説明します.

一.工場モード

ファクトリモードはソフトウェアエンジニアリング分野で広く知られている設計モードであるが,ECMAScriptではクラスを作成できないため,関数パッケージで特定のインタフェースでオブジェクトを作成する.その実現方法は非常に簡単で、つまり関数内にオブジェクトを作成し、オブジェクトに属性と方法を与えてからオブジェクトを戻せばよい.

function createBlog(name, url) {
    var o = new Object();
    o.name = name;
    o.url = url;
    o.sayUrl= function() {
        alert(this.url);
    }
    return o;
}
var blog1 = createBlog('wuyuchang', 'http://www.cnblogs.com/wuyuchang/');

ファクトリモードの実装方法は非常に簡単で,複数の類似オブジェクトを作成する問題を解決したが,ファクトリモードではオブジェクトのタイプを識別することができず,すべてObjectでありDate,Arrayなどとは思えないため,コンストラクション関数モードが出現した.

二.コンストラクタモード

ECMAScriptのコンストラクション関数では、Array、DateなどのオリジナルJSのような特定のタイプのオブジェクトを作成できます.その実現方法は以下の通りである.

function Blog(name, url) {
    this.name = name;
    this.url = url;
    this.alertUrl = function() {
        alert(this.url);
    }
}
var blog = new Blog('wuyuchang', 'http://www.cnblogs.com/wuyuchang/');
console.log(blog instanceof Blog);    // true，   blog   Blog   ，           

この例は工場モードで関数名が異なる以外に、注意深い子供靴は多くの違いを発見しなければならない.

関数名の頭文字は大文字(標準では頭文字を大文字とすることは厳密に規定されていないが、慣例に従って、関数を構築する頭文字は大文字

である.

に表示されない作成オブジェクト

プロパティとメソッドはthisオブジェクト

に直接割り当てられます.

return文がない

newを使用してオブジェクトを作成する

はオブジェクトを識別することができる(これはまさに構造関数モードが工場モードより優れている場所である)

.
コンストラクション関数は使いやすいが、欠点がないわけではない.コンストラクション関数を使用する最大の問題は、インスタンスを作成するたびにメソッドを再作成することである(理論的にはオブジェクトを作成するたびにオブジェクトの属性が異なり、オブジェクトのメソッドは同じである).しかし、2回完全に同じメソッドを作成する必要はないので、関数をオブジェクトの外に移動することができます(一部の子供靴は欠点を見ているかもしれませんが、嘘!).

function Blog(name, url) {
    this.name = name;
    this.url = url;
    this.alertUrl = alertUrl;
}
function alertUrl() {
    alert(this.url);
}
var blog = new Blog('wuyuchang', 'http://www.cnblogs.com/wuyuchang/'),
    blog2 = new Blog('cnblogs', 'http://www.cnblogs.com/');
blog.alertUrl();    // http://www.cnblogs.com/wuyuchang/
blog2.alertUrl();    // http://www.cnblogs.com/

私たちはalertUrlをグローバル関数に設定し、blogとblog 2がアクセスするのは同じ関数ですが、問題はまた来て、グローバル役割ドメインで実際にBlogにのみ使用したい関数を定義し、グローバル役割ドメインを名実ともに示すことを示しています.さらに受け入れられないのは、グローバル役割ドメインで特定のオブジェクトのみが使用する方法を定義していることです.空間を浪費しているのは言うまでもなく、明らかにオブジェクト向けのパッケージ性を失っています.したがって、この問題はプロトタイプで解決できます.

三.プロトタイプ

作成した各関数にはprototype(プロトタイプ)プロパティがあります.このプロパティはポインタであり、オブジェクトを指します.このオブジェクトの用途は、特定のタイプのすべてのインスタンスで共有できるプロパティとメソッドを含むことです.プロトタイプオブジェクトを使用する利点は、すべてのオブジェクトインスタンスに含まれるプロパティとメソッドを共有できることです.

function Blog() {
}
Blog.prototype.name = 'wuyuchang';
Blog.prototype.url = 'http://www.cnblogs.com/wuyuchang/';
Blog.prototype.friend = ['fr1', 'fr2', 'fr3', 'fr4'];
Blog.prototype.alertInfo = function() {
    alert(this.name + this.url + this.friend );
}
//        
var blog = new Blog(),
    blog2 = new Blog();
blog.alertInfo();    // wuyuchanghttp://www.cnblogs.com/wuyuchang/fr1,fr2,fr3,fr4
blog2.alertInfo();   // wuyuchanghttp://www.cnblogs.com/wuyuchang/fr1,fr2,fr3,fr4
blog.name = 'wyc1';
blog.url = 'http://***.com';
blog.friend.pop();
blog2.name = 'wyc2';
blog2.url = 'http://+++.com';
blog.alertInfo();    // wyc1  http://***.comfr1,fr2,fr3
blog2.alertInfo();    // wyc2  http://+++.comfr1,fr2,fr3

プロトタイプモードも欠点がないわけではありません.まず、コンストラクション関数が初期化パラメータを渡す部分を省略します.その結果、すべてのインスタンスがデフォルトで同じ属性値を取得するのは非常に不便ですが、これはプロトタイプの最大の問題ではありません.プロトタイプモードの最大の問題は共有の本性によるもので、共有のため、1つのインスタンスが参照を修正し、もう1つのインスタンスも参照を変更しました.したがって,我々は通常,プロトタイプを単独で使用するのではなく,プロトタイプモードと構造関数モードを結合する.

四.ハイブリッドモード(プロトタイプモード+コンストラクション関数モード)

function Blog(name, url, friend) {
    this.name = name;
    this.url = url;
    this.friend = friend;
}
Blog.prototype.alertInfo = function() {
    alert(this.name + this.url + this.friend);
}
var blog = new Blog('wuyuchang', 'http://www.cnblogs.com/wuyuchang/', ['fr1', 'fr2', 'fr3']),
    blog2 = new Blog('wyc', 'http://**.com', ['a', 'b']);
blog.friend.pop();
blog.alertInfo();    // wuyuchanghttp://www.cnblogs.com/wuyuchang/fr1,fr2
blog2.alertInfo();    // wychttp://**.coma,b

ブレンドモードでは、コンストラクション関数モードを使用してインスタンスプロパティを定義し、プロトタイプモードを使用してメソッドと共有プロパティを定義します.各インスタンスには独自のインスタンスプロパティがありますが、メソッドを共有し、メモリを最大限に節約できます.さらに,このモードは初期パラメータの伝達をサポートする.長所が多い.このモードは、ECMAScriptで最も広く、最もアイデンティティの高いカスタムオブジェクトを作成する方法です.

五.ダイナミックプロトタイプモード

ダイナミックプロトタイプモードは、すべての情報をコンストラクション関数にカプセル化し、コンストラクション関数でプロトタイプを初期化する(最初のオブジェクトのみがインスタンス化されたときにプロトタイプを初期化する)ことによって、この方法が有効かどうかを判断することによって、プロトタイプを初期化する必要があるかどうかを選択することができる.

function Blog(name, url) {
    this.name = name;
    this.url = url;
    if (typeof this.alertInfo != 'function') {
        //           
        alert('exe time');
        Blog.prototype.alertInfo = function() {
            alert(thia.name + this.url);
        }
    }
}
var blog = new Blog('wuyuchang', 'http://www.cnblogs.com/wuyuchang'),
    blog2 = new Blog('wyc', 'http:***.com');

上記の例では、「exe time」、すなわちblogが初期化されると、blog 2はプロトタイプを初期化する必要がなく、このモードを使用してオブジェクトを作成するにはperfectと言える.