72

サイトで使用されているすべてのグローバル変数を一覧表示するにはどうすればよいですか? どのブラウザのJavaScriptデバッガでもそれを行うことができますか? 使用とは、変更/追加ではなく読み取りを意味します。iframeのものを検出するのもいいでしょう。

注意: サイトごとに「影響を受ける」グローバル変数のリストを取得する必要があります。それらのすべてまたは追加されたものまたは編集されたものではなく、サイトスクリプトのどこかで使用されたもの.

4

9 に答える 9

89

Chrome で、開発ツールに移動し、コンソールを開きます。次に、次のように入力します。

Object.keys( window );

これにより、すべてのグローバル変数の配列が得られます。

編集

Googleで少し検索した後、方法を見つけました。firefoxとjslinterアドオンが必要です。

セットアップが完了したら、jslinter を開き、 [オプション] -> [未使用のパラメーターを許容する] 以外の左側の列のすべてをチェックします。

次に、Web ページで jslinter を実行し、結果を下にスクロールします。未使用の変数のリストが表示されます(グローバル変数、次に各関数のローカル変数)。

コンソールで実行Object.keys(window);し、両方の結果を比較して、どちらが使用されているかを判断します。

于 2013-06-24T13:06:20.630 に答える
7

そのために、既存のすべてのグローバル変数に対して作成するゲッターを使用することができます。ページが開始される前にこれを実行します。

Object.keys(window) // or
Object.getOwnPropertyNames(window).concat(
  Object.getOwnPropertyNames(Object.getPrototypeOf(window))
) // or whatever
.forEach(function(name) {
    var d = Object.getOwnPropertyDescriptor(window, name),
        def = Object.defineProperty,
        log = console.log.bind(console);
    if (d && !d.configurable)
        return log("cannot detect accessing of "+name);
    def(window, name, {
        configurable: true,
        get: function() {
            log("window."+name+" was used by this page!");
            if (d) {
                def(window, name, d);
                return d.get ? d.get() : d.value;
            } else { // it was not an own property
                delete window[name];
                return window[name];
            }
        },
        set: function(x) {
            log("Ugh, they're overwriting window."+name+"! Something's gonna crash.");
        }
    });
});

もちろん、プロパティ記述子などは古いブラウザと互換性がありません。また、プログラムでリストできない可能性があるグローバル変数/windowプロパティ (on*ハンドラーなど) がいくつかあることに注意してください。それらが必要な場合は、配列に明示的にリストする必要があります。関連する質問を参照ウィンドウ オブジェクトのすべてのプロパティを一覧表示しますか? そのためのクロスブラウザ有効な JavaScript 名。

それでも、@stackErro が提案したように、宣言されていないグローバル変数について愚痴をこぼすコード カバレッジ ツールを実行すると、より役立つと思います。

于 2013-06-24T15:23:48.120 に答える
3

次のコードをコピーして JavaScript コンソールに貼り付けます

var keys = Object.getOwnPropertyNames( window ),
    value;

for( var i = 0; i < keys.length; ++i ) {
    value = window[ keys[ i ] ];
    console.log( value );
}

すべてのクレジットは RightSaidFred ( Javascript - すべてのグローバル変数のダンプ)

お役に立てば幸いです

于 2013-06-24T13:13:40.703 に答える
2

私が時々使用するグローバルをリストする簡単な方法。最初に、スクリプトが実行される前に、このコードをできるだけ早く配置します。

var WINDOW_PROPS = Object.keys(window);

次に、グローバルを検出する必要があるときに、次のようにします。

var GLOBALS = Object.keys(window)
    // filter the props which your code did not declare
    .filter(prop => WINDOW_PROPS.indexOf(prop) < 0)
    // prettify output a bit :) It's up to you...
    .map(prop => `${typeof window[prop]} ${prop} ${window[prop]}`)
    // sort by types and names to find easier what you need
    .sort();

console.log(GLOBALS.join("\n"));

ここでは、コードを短縮するためにいくつかの ES6 機能を使用しました。本番環境にはまだ適していませんが、デバッグ目的には十分であり、最新のブラウザーで動作するはずです。

于 2017-08-17T09:59:35.677 に答える
-1

私が行っている JetBrains PhpStorm の使用を試すことができます。どのシステムでも 30 日間無料で試用できます。次に、JSLintまたはJSHint、またはその両方を確認すると、未使用のすべての変数に下線が引かれ、（テーマに応じて）異なる色で強調表示され、スクロールバーに表示されます。

編集: コミュニティ バージョンは現在無料だと思います。

于 2014-02-15T14:55:41.650 に答える