12

バックグラウンド

長くて醜いJavascriptをリファクタリングしようとしています（恥ずべきことに、それは私自身のものです）。Javascript を学び始めたときにプロジェクトを開始しました。それは素晴らしい学習体験でしたが、私のコードには総ゴミがあり、かなり悪い慣行を採用しています。その主なものは、グローバル名前空間/オブジェクト (私の場合はwindowオブジェクト) の深刻な汚染です。上記の汚染を軽減するための私の努力では、それを測定することが役立つと思います.

アプローチ

私の本能は、windowコードをロードする前、サードパーティのライブラリをロードした後、最後にコードが実行された後に、オブジェクトにアタッチされたオブジェクトの数を単純にカウントすることでした。次に、リファクタリングするときに、コードのロードに対応する増加を減らすようにします)。これを行うために、私は使用しています：

console.log(Object.keys(window).length)

私のコードのさまざまな場所で。これは問題なく機能しているようで、特に自分のコードがロードされた後、数が増えるのがわかります。しかし...

問題

Chrome 開発者コンソールでオブジェクトの内容を見るだけで、windowオブジェクトに添付されているすべてのものをカウントしていないことがわかります。ブラウザ、ライブラリ、または自分のコードに属しているかどうかにかかわらず、より基本的なプロパティまたはオブジェクトの種類が含まれていないと思われます。いずれにせよ、リファクタリングに役立つグローバルな名前空間の汚染を測定するためのより適切で正確な方法を誰か思いつくことができるでしょうか?

前もって感謝します！

4

2 に答える 2

7

したがって、 Felix KlingとLèsemajestéが残したコメントのいくつかの後で、私はうまく機能する解決策を見つけました。ライブラリまたは自分のコードをロードする前に、dashboardグローバルオブジェクト（私の唯一の意図的なオブジェクト）を作成し、次の方法でアタッチされたオブジェクトのリストを保存しますwindow。

var dashboard = {
    cache: {
        load: Object.getOwnPropertyNames(window)
    }
};

次に、すべてのライブラリをロードした後、独自のコードをロードする前に、dashboardオブジェクトを変更して、 pollution（新しいdebug名前空間内に）メソッドを追加します。

dashboard.debug = {
    pollution: (function() {
        var pollution,                                     
            base = cache.load, // window at load         
            filter = function(a,b) { // difference of two arrays
                return a.filter(function(i) {
                    return !(b.indexOf(i) > -1);
                });
            },                          
            library = filter(Object.getOwnPropertyNames(window), base), 
            custom = function() { 
                return filter(Object.getOwnPropertyNames(window),
                        base.concat(library)); 
            };       

        delete cache.load;

        pollution = function() {
            console.log('Global namespace polluted with:\n ' + 
                    custom().length + ' custom objects \n ' +
                    library.length + ' library objects');

            return {custom: custom().sort(), library: library.sort()};
        };

        return pollution;
    }())  
};

いつでも、コンソールからこのメソッドを呼び出して、

汚染されたグローバル名前空間：
53個のカスタムオブジェクト
44個のライブラリオブジェクト

これらのオブジェクトに関連付けられたキーを一覧表示する2つの配列も同様です。baseとlibraryスナップショットは静的ですが、現在のカスタム測定（via ）customは動的であるため、AJAXを介してカスタムjavascriptをロードすると、再測定して新しいカスタム「汚染」を確認できます。

于 2012-08-20T19:57:20.277 に答える