ReSharper 2025.1 ヘルプ

JavaScript でのナビゲーションと検索

ReSharper のナビゲーションと検索機能のほとんどは、JavaScript でもサポートされています。これらの機能の詳細については、移動して検索の該当するトピックを参照してください。このセクションのサブジェクトでは、フィーチャマトリックスを見つけて、JavaScript で正確にサポートされているものを確認することもできます。

このトピックでは、JavaScript のナビゲーションおよび検索機能の使用例をいくつか見つけることができます。

ナビゲーションコマンドが利用できます:

  • ReSharper | 移動メニュー

  • エディターのコンテキストメニュー

  • 次に移動コンテキストメニュー

あなたもすることができます:

  • ファイル構造ウィンドウから移動する

  • シンボルの使用箇所を見つける

ファイル構造

ファイル構造は現在のファイルの構造を概観できます。ReSharper は、すべてのプログラミング言語に共通のコード構造だけでなく、JavaScript などの特定の構文(モジュールなど)を検出します。すべてのモジュールメンバーはモジュール内でのみ表示されるため、対応するアイコン Lock がメンバーごとに表示されます。

ReSharper: File Structure for JavaScript files

ファイル構造ウィンドウに無名関数、名前のない関数を表示するために、ReSharper はそれらの宣言からそれらの名前を取得します。

ReSharper: File Structure for JavaScript files

ReSharper は XML ドキュメントのコメントを考慮に入れて有用な情報を抽出します。パラメーターのデータ・型が関数シグネチャー内で明示的に指定されていない場合でも、それらは XML ドキュメント内で指定されているため、ファイル構造ウィンドウに表示されます。

ReSharper: File Structure for JavaScript files

また、ファイル構造ウィンドウでメンバーをダブルクリックすると、メンバー宣言に移動できます。

宣言に移動

宣言に移動 - 関数の名前にキャレットを置き、関数が宣言されているファイルに直接移動します。

ReSharper: Go to Declaration in JavaScript

選択したアイテムに複数の宣言がある場合は、リストから 1 つを選択するように求められます。

ペアの <script> タグ内で宣言された関数は、現在のファイルでのみ表示されることに注意してください。

使い方に移動

シンボルの使用に移動 - ソリューション全体で関数の使用回数を調べたい場合に非常に便利です。

ReSharper: Go to Usage in JavaScript

ペアの <script> タグ内にキャレットを配置してコマンドを呼び出すと、ReSharper は現在のファイルのみを調べます。

ファイルメンバーに移動

ファイルメンバーに移動 - 現在のファイル内の目的のメンバーにすばやく移動できます。

ReSharper: Go to File Member in JavaScript

数千行のコードをスキャンせずにあなたの周囲を見つけるには、ReSharper の検索機能を使用してください。通常どおり、特定の検索ターゲットを定義し、使用箇所の検索使用箇所の検索 Advanced の機能を使って検索範囲を変えることができます。

シンボルの使い方を探す

  1. キャレットを変数または関数の名前に置きます。

  2. 以下のいずれか 1 つを実行します:

    • メインメニューから ReSharper | 検索 | 使用箇所の検索を選択します。

    • コンテキストメニューで使用箇所の検索をクリックします。

    • Alt+F7 を押します。

    使用箇所が 1 つだけ見つかった場合、ReSharper はエディターで直接使用箇所に移動します。

    複数の使用箇所が見つかった場合は、検索結果ウィンドウが開きます。

以下のスクリーンショットでは、使用箇所の検索使用箇所の検索 Advanced の違いがわかります。

ReSharper: Find Usages in JavaScript

検索結果ウィンドウからソースコード内の使用方法に移動するには、使用方法を選択してダブルクリックします。

現在のファイル内のシンボルの使用箇所をすべて表示するには、Control+Shift+F7 を押して、このファイル内の使用箇所をハイライトします。

ReSharper: Highlight Usages in JavaScript

構造検索と置換

特に類似しているが同一ではない構文構成を探しているときは、標準の検索機能では役に立たないことがあります。そのような場合は、構造検索と置換機能が役立ちます。この機能を使用して実を結ぶには、3 つのステップを実行します。プレースホルダーの作成、パターンの作成、検索プロセスの呼び出しです。

空の catch ブロックを持つ try catch ステートメントを見てみましょう。この目的のために、次のパターンを使用することができます。

ReSharper: Structural Search and Replace in JavaScript

標準の JavaScript 言語構文に加えて、$ ドル記号で囲まれたプレースホルダーが表示されます。これらのプレースホルダーは、パターンの右側に表示されます。空の catch ブロックを探しているため、ここで最も重要な条件は catch ステートメントの空の中括弧です。すべての条件が定義されるとすぐに、検索をクリックして検索プロセスを開始します。

すべての結果が検索結果ウィンドウに表示されます。プレビューでわかるように、ReSharper は空の catch ブロックを持つ try catch ステートメントのみを検出しました。

ReSharper: Structural Search and Replace in JavaScript

ソースコードから直接パターンを作成することができます。目的のコードブロックを選択し、選択範囲を右クリックし、コンテキストメニューでパターンで検索を選択します。

2024 年 5 月 26 日

関連ページ:

移動して検索

ReSharper を使用すると、宣言、メンバー、メソッド呼び出し、継承階層、エラーなどを使用して、ソースコードを簡単に見つけることができます。ナビゲーションと検索の範囲は、ソリューションのファイルに限定されません。必要に応じて、参照ライブラリのシンボルをナビゲーションまたは検索結果に含めることができます。オブジェクトブラウザー、ソリューションエクスプローラー、クラスビュー、ファイル構造、検索結果、その他の ReSharper ツールウィンドウから、エディター内の任意の場所からナビゲーションを開...

構造別にファイルを移動する

ファイル構造ウィンドウ:ReSharper では、ファイル構造ウィンドウを使用して現在のドキュメントの構造を移動でき、大きなファイルでのナビゲーションが大幅に簡素化されます。ウィンドウはエディターと同期されます。別のエディタータブに切り替えると、ウィンドウには対応するファイルの構造が表示されます。ファイル構造ウィンドウを開いて使用するを押すか、メインメニューからを選択します。あるいは、を押して、ポップアップでコマンド名を入力して、そこで選択することもできます。現在のドキュメントの内容はツリー

宣言に移動

このコマンドを使用して、任意のシンボルの使用箇所からシンボルの宣言に移動します。このコマンドは、ソリューションエクスプローラー、ファイル構造ウィンドウ、その他のツールウィンドウから呼び出すことができます。反対方向(シンボルの使用箇所)に移動するには、すでにシンボル宣言を行っているときに宣言に移動コマンドを呼び出すか、シンボルの使用に移動コマンドを使用できます。シンボルの宣言に移動するキャレットをエディターのシンボルに配置するか、ツールウィンドウでシンボルを選択します。メインメニューで選択するか

ファイルメンバーに移動

このコマンドを使用すると、現在のドキュメント内の特定のメソッド、フィールド、プロパティ(ソースファイルまたは逆コンパイルによって再構築されたファイル)にすばやく移動できます。このコマンドを使用して、現在のドキュメント内のテキストを検索することもできます。テキストの一致は、一致するメンバーの後にポップアップに表示されます。ファイルメンバーまたはテキスト出現箇所に移動するを押すか、メインメニューからを選択します。あるいは、を押して、ポップアップでコマンド名を入力して、そこで選択することもできます

構造検索と置換

場合によっては、正規表現に一致する特定のシンボルやテキストの出現を検索するなどの標準的な検索方法では、目的の結果が得られない場合があります。例: プロジェクトに固有のコードの匂いを見つけたり、リファクタリングする必要があるコードを見つける必要があるかもしれません。ReSharper を使用すると、特定のパターンに一致するコードブロックを検索し、必要に応じて置き換えることができます。これらのブロックはまったく異なる場合があります。異なるタイプ、式、ステートメントなどを含むことができますが、論理的に...

検索結果を分析する

ReSharper のナビゲーション操作と検索操作で複数の結果が得られた場合、これらの結果を検索結果ウィンドウに表示することができます。検索結果ウィンドウは、検索結果を分析するためのさまざまな方法を提供します。デフォルトの動作を変更して、見つかった単一の使用箇所も検索結果ウィンドウに表示されるようにすることができます。これを行うには、ReSharper オプション Alt+R, O のページで使い方: 1 つだけの結果がある場合は .... チェックボックスをオフにします。一部のアクション、たとえば使...