構造検索と置換

ターゲットを構造的に検索する

1. メインメニューで編集 | 検索 | 構造検索に移動して、構造検索ダイアログを開きます。

   構造置換ダイアログにすばやく切り替えるには、 をクリックします。

   

2. 構造検索ダイアログで、次のいずれかの操作を行います。

   • テンプレートを最初から作成します。テンプレートのリストから下書きテンプレートを選択し、エディター領域にコードテンプレート (たとえば、コードを表す $variable$) を入力します。

     カスタムテンプレートを将来使用するために保存するには、ダイアログツールバーの「テンプレートの保存」アイコン（）をクリックします。テンプレートをインスペクションとして保存することもできます。

     

     WebStorm は、作成したテンプレートをテンプレートリストの最近ノードに追加します。

   • 既存のテンプレートの 1 つをプロトタイプとして使用します。使用可能な既存のテンプレートのリストから必要なテンプレートを選択します。

     

   • 例 1

     次のクラスから関数を見つけてみましょう。

     class Person { constructor(firstName, lastName, age, eyeColor) { this.firstName = firstName; this.lastName = lastName; this.eyeColor = eyeColor; this.age = age; } move(distanceInMeters) { console.log(`Person moved ${distanceInMeters}m.`); } sing(a) { console.log(`Person sings ${a}`); } jump (distanceInMeters,heightInMeters) { console.log(`Person jumped ${heightInMeters}m high and ${distanceInMeters}m right.`); } RETIRED(age) { return age >= 60; } }

     1. 既存のテンプレートの一覧から、JavaScript をクリックし、一般ノードを展開して、関数テンプレートを選択します。

        

     2. プロジェクト全体でこれらの構造を検索するには、検索をクリックします。WebStorm をクリックすると、検索ツールウィンドウに検索結果が表示されます。

        

     3. 現在のファイル内のすべての関数を検索するには、スコープをクリックし、リストから現在のファイルを選択して、検索をクリックします。

        

        結果は検索ツールウィンドウにも表示されます。

3. 構造検索ダイアログには、選択したテンプレートとそのフィルターの値が表示されます。既存のフィルターを編集したり、新しい条件を追加したりできます。コード変数にキャレットを置き、フィルター領域を使用してフィルターを管理します。

   例: テンプレート内のパラメーターの数を変更するには、$parameter$ 変数を選択し、適切な最小数を指定します。

   

   検索をクリックすると、WebStorm は検索ツールウィンドウを開き、2 つ以上のパラメーターを持つメソッドのリストが表示されます。この例では、jump (distanceInMeters,heightInMeters) {} のみが表示されます。

   

4. 例 2

   $name$ 変数に条件を追加してみましょう。

   1. 修飾子パネルで、追加（）をクリックして新しい修飾子を作成します。正規表現を使用する場合は、テキストを選択します。変数に応じて他の修飾子を追加することもできます。

   2. テキスト修飾子の場合は、次の正規表現を入力します。

      \b[A-Z]+\b

      

   3. 大 / 小文字を区別するチェックボックスをオンにして検索をクリックすると、関数名に大文字が含まれる関数のみが検索ツールウィンドウに表示されます。この例では、関数 RETIRED が該当します。

      

5. 選択した言語に応じて、追加のオプションも利用できます。

   例: 次のオプションを確認します。

   • 言語 : リストを使用して、検索に含めるファイルの種類を選択します。この場合は JavaScript です。

   • ターゲット : リストを使って検索する項目を選択します。この場合は name です。

     

   • 再帰 : 選択すると、WebStorm は再帰検索を実行し、ネストされたすべての項目が結果に含まれます。例: 再帰を有効にしてメソッド呼び出しを検索すると、WebStorm は foo(foo(foo())) 内のネストされた呼び出しを検索します。再帰を無効にすると、外側の呼び出しのみが検索されます。

   • 挿入されたコード : 選択すると、HTML 内の JavaScript や Java 内の SQL などの挿入されたコードも検索に含まれます。

   • 大 / 小文字を区別する : 選択すると、検索結果は検索対象の大文字と小文字を一致させます。

6. 検索範囲（プロジェクト、モジュール、ディレクトリ、カスタムスコープ）を指定します。

7. 検索をクリックします。

   WebStorm は、検索ツールウィンドウに結果を表示します。

   

ターゲットを構造的に置き換える

1. メインメニューで、編集 | 検索 | 構造置換に移動します。

2. 構造置換ダイアログで、新規または既存のテンプレートを検索に追加し、テンプレート領域を置き換えます。置換テンプレートは、検索テンプレートと同じ方法で保存できます。

3. 置換テンプレート内の変数にフィルターを追加する必要がある場合は、対象の変数にキャレットを置き、フィルター領域を使用してフィルターを管理します。

4. フィルター領域では、あなたのように選択した内容に応じて、フィルター条件を指定してください。

   例: 検索した変数 $name$ を取得し、見つかったテンプレートを小文字に置き換える条件を追加しましょう。

   変数 $name2$ を呼び出して、基本的に Groovy スクリプトである次のフィルタースクリプトを追加してみましょう: name.name.toLowerCase()

   スクリプトが指定されていない場合、WebStorm は新しい変数をハイライトし、マウスをホバーするとスクリプトが不足していることを示すツールヒントが表示されます。

   

   スクリプトの追加リンクをクリックし、開いた編集フィールドでスクリプトを指定します。

   

5. 置換結果を絞り込むには、次のオプションを選択します。

   • 完全修飾名を短縮する - 完全修飾クラス名を短縮名およびインポートに置き換えます。

   • 再フォーマット - 置き換えられたコードを自動的にフォーマットします。

   • 静的インポートを使用する - 可能であれば、静的インポートを代わりに使用します。

   必要なオプションを指定したら、検索をクリックします。WebStorm は検索ツールウィンドウに結果を表示します。

6. 検索ツールウィンドウでは、結果をさらに操作して、見つかったアイテムを 1 つずつ、または一度にすべて置き換えたり、潜在的な変更をプレビューしたりできます。

検索テンプレートを共有する

エクスポートまたはインポートすることで、検索テンプレートを同僚と共有できます。

1. 構造検索ダイアログ（編集 | 検索 | 構造検索）で、新しい検索テンプレートを作成するか、既存のテンプレートを使用します。

2. テンプレートをエクスポートするには、 をクリックします。WebStorm は、テンプレートの XML 表現をクリップボードに追加します（クリップボードの内容を表示するには、Ctrl+Shift+V を押します）。この表現は、チャット、メール、フォーラムで他の開発者と共有できます。

   テンプレートをインポートするには、共有 XML コードを任意の場所（メール、チャット、フォーラム）からコピー（Ctrl+C）し、構造検索ダイアログで をクリックします。WebStorm は、XML コード表現を取得し、変数とスコープが存在する場合はそれを含むテンプレートに変換します。