5

今までは、Revealing Module パターンを使用して、次のように Javascript を構築していました。

     var module = (function() {
        var privateVar;

        // @public
        function publicFunction( ) {

        }       

        return {
            publicFunction: publicFunction
        }
    })();

フィドル

このコードは期待どおりに動作しますが、このパターンは複数のインスタンスがある場合に大量のメモリを使用し、他のパターンに比べて速度に問題があるという記事を最近読みました。私はこのパターンでの作業を楽しんでいるので、これらすべての「問題」のない類似のパターンを検索し、Revealing Prototype パターンに出会いました。私の知る限り、JavaScript の Prototype はメモリ管理がはるかに優れています。

Revealing Prototype Pattern を使用する方がメモリにとってより高速/より良いかどうか疑問に思っていますか? このベンチマークは私を驚かせました。モジュール パターンの方がはるかに高速に見えるからです。何か理由はありますか？

また、Revealing Prototype パターンを使用して複数のインスタンスを作成する方法がわかりませんでした (上記の Revealing Module Pattern Fiddle と比較してください)。

    var prototypeModule = function( el ) {
        this.init( );
    };

    prototypeModule.prototype = function () {
        var privateVar;

        // @public
        function init( ) {            

        }  

        return {
            init: init
        }
    }();

フィドル 2

私は何を間違っていますか？

4

1 に答える 1

4

このコードは期待どおりに機能しますが、複数のインスタンスがある場合、このパターンは大量のメモリを使用するという最近の記事を赤字にしました。

最初のスニペットで提示したコードはシングルトン モジュールであり、「複数のインスタンス」はありません。それは完全に問題ありません。

フィドルでタイトルを付けたものだけが、非常に大量のオブジェクトをインスタンス化するときにメモリの欠点Module pattern - Multiple instancesに悩まされます。ただし、これは「モジュール パターン」ではなく「ファクトリー パターン」であることに注意してください。

Revealing Prototype Pattern を使用する方がメモリにとってより高速/より良いかどうか疑問に思っていますか?

一般的に、正しく適用されれば、はい。

このベンチマークは私を驚かせました。モジュール パターンの方がはるかに高速に見えるからです。何か理由はありますか？

それらのモジュールのコードは、すべての修復を超えて台無しになっています。私はそこで何が起こっているのかについてコメントしようとさえしていません。

また、Revealing Prototype パターンで複数のインスタンスを作成する方法がわかりませんでした

プロトタイプの利点は、そのプロパティがすべてのインスタンス間で共有されることです。これは.init、すべてのインスタンスのメソッドが同じ関数を指していることを意味します。この関数はprivateVar、その公開モジュール スコープ内に 1 つの値を持ちます。この変数は、すべてのインスタンスに対して 1 回だけ存在します。これは静的であり、インスタンス固有ではありません。

プロトタイプを使用したい場合、完全にプライベートな変数にアクセスすることはできません。パブリック プロパティを使用する必要があります。ただし、clickFunctionクロージャーにはとにかくローカル (プライベート) 変数が必要なので、ここでプロトタイプを使用しなくても問題はありません。

function Constructor( el ) {
    var privateVar = $( el );
    privateVar.on( 'click', function clickFunction() {
        privateVar.addClass('click');
    });

    console.log( 'constructor: ' + privateVar.attr('id') ); 
}
于 2014-06-30T12:31:34.870 に答える