1. ホーム
  2. ジャバスクリプト

[解決済み】ChromeでJavaScriptの関数定義を検索する

2022-03-27 04:44:15

質問

Chromeのデベロッパーツールは素晴らしいのですが、JavaScriptの関数の定義を見つける方法が(私が見つけた限り)ないようなのです。私は多くの外部JSファイルを含むサイトに取り組んでいるため、これは私にとって超便利です。確かにgrepはこれを解決してくれますが、ブラウザの方がずっといいでしょうね。つまり、ブラウザはこのことを知らなければならないので、なぜそれを公開しないのでしょうか?私が期待したのは、次のようなものでした。

  • ページで「要素の検査」を選択すると、「要素」タブでその行がハイライトされます。
  • 行を右クリックし、「関数定義へ移動」を選択します。
  • スクリプトタブに正しいスクリプトが読み込まれ、関数定義にジャンプします。

まず最初に、この機能は存在し、私が見逃しているだけなのでしょうか?

もしそうでなければ、これは WebKit に由来するものだと思うのですが、そのためのものが見つかりませんでした。 デベロッパーツールの機能要望 または WebKit のバグジラ .

解決するには?

という名前の関数を探しているとしよう。 foo :

  1. (open Chrome dev-tools)を使用します。
  2. Windowsの場合 ctrl + シフト + F , またはmacOS。 cmd + オプタン + F . これにより、すべてのスクリプトを横断的に検索するためのウィンドウが開かれます。
  3. 正規表現にチェックを入れます。
  4. を検索する foo\s*=\s*function (を検索します)。 foo = function この3つのトークンの間に任意の数のスペースを入れてください)。
  5. 返された結果を押す。

関数定義のもう一つのバリエーションは function\s*foo\s*\( に対して function foo( この3つのトークンの間には、任意の数のスペースを入れてください。