WebStorm 2021.2 Help

Structural search and replace结构搜索和替换

A conventional search process does not take into account the syntax and semantics of the source code. 传统的搜索过程不考虑源代码的语法和语义。Even if you use regular expressions, WebStorm still treats your code as a regular text. 即使使用正则表达式,WebStorm仍然将代码视为正则文本。The structural search and replace(SSR) actions let you search for a particular code pattern or grammatical construct in your code considering your code structure.结构化搜索和替换SSR)操作允许您根据代码结构在代码中搜索特定的代码模式或语法结构。

WebStorm finds and replaces fragments of source code, based on the search templates that you create and conditions you apply.WebStorm根据您创建的搜索模板和应用的条件查找并替换源代码片段。

Search for a target structurally从结构上搜索目标

  1. From the main menu, select Edit | Find | Search Structurally to open the Structural Search dialog.从主菜单中,选择“编辑”|“查找”|“结构化搜索”以打开“结构化搜索”对话框。

    Structural Search dialog
  2. In the Structural Search dialog, do one of the following:在“结构搜索”对话框中,执行以下操作之一:

    • Create your own template from scratch.从头开始创建自己的模板。

      In the editor area, enter the code template ($variable$ that represents your code), click the Settings button, and select Save Template to save it for future use.在编辑器区域中,输入代码模板($variable$,表示您的代码),单击the Settings button,然后选择“保存模板”,将其保存以备将来使用。

      Structural Search dialog: save template

      WebStorm adds the created template to the existing template list (User Defined node) in the Existing Templates dialog.WebStorm将创建的模板添加到“现有模板”对话框中的现有模板列表(“用户定义”节点)。

    • Use one of the existing templates to act as a prototype.使用现有模板之一作为原型。

      Click the Settings button, select Existing Templates to open the list of predefined templates, and select the appropriate one.单击the Settings button,选择“现有模板”以打开预定义模板的列表,然后选择适当的模板。

      Open the list of existing templates

      Consider the following example class:考虑下面的示例类:

      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; } }

      Let's find a certain method in the class.让我们在课堂上找到一种方法。

      In the list of existing templates, click Javascript, expand the General node, and select the Functions template.在现有模板列表中,单击“Javascript”,展开“常规”节点,然后选择“Functions”模板。

      the Existing Templates dialog

      Click OK to return to the Structural Search dialog to work with the selected template.单击“确定”返回“结构搜索”对话框以使用选定的样板。

      WebStorm instantly highlights the found code occurrences in the editor.WebStorm会立即在编辑器中突出显示找到的代码。

      Found occurrences highlighted
  3. The Structural Search dialog displays the selected template and the values of the filters used in the template. 结构搜索”对话框显示选定的模板以及模板中使用的过滤器的值。You can edit the existing filters or add new conditions,. 您可以编辑现有过滤器或添加新条件Place the caret at the code variable and use the filter area to manage filters.将插入符号放在代码变量处,并使用过滤器区域管理过滤器。

    For example, to change the number of parameters in the template, select the $parameter$ variable and specify the appropriate minimum number of them.例如,要更改模板中的参数数量,请选择$parameter$变量并指定相应的最小参数数量。

    the Edit filters popup

    When you click Find, WebStorm opens the Find tool window with a list of methods with two and more parameters, in our example, only jump (distanceInMeters,heightInMeters) {} is shown.单击“查找”时,WebStorm会打开“查找”工具窗口,其中包含一个包含两个或更多参数的方法列表,在我们的示例中,仅显示jump (distanceInMeters,heightInMeters) {}

    Structural Search: results
  4. In the filter area, click the Add button to add a new condition. 在筛选区域中,单击the Add button以添加新条件。If, for example, you need to add a regular expression, select Text. 例如,如果需要添加正则表达式,请选择“文本”。You can also add other conditions depending on your variable.还可以根据变量添加其他条件。

  5. In the field that opens, type your condition.在打开的字段中,键入您的条件。

    For example, let's type the following regular expression:例如,让我们键入以下正则表达式:

    \b[A-Z]+\b
    Add regular expression to the filter dialog

    In this case WebStorm will only search for the fields with uppercase characters.在这种情况下,WebStorm将只搜索带有大写字符的字段。

    Also note that by default, the Recursive checkbox is selected. 还请注意,默认情况下,选中了“递归”复选框。That means that WebStorm performs the recursive search and all nested items will be included in the results. 这意味着WebStorm执行递归搜索,所有嵌套项都将包含在结果中。For example, when you search for a method call, with the Recursive option enabled, WebStorm will find nested method calls in foo(foo(foo())). 例如,当您在启用“递归”选项的情况下搜索方法调用时,WebStorm将在foo(foo(foo()))中找到嵌套的方法调用。With the Recursive option disabled, only the outer method call will be found.禁用“递归”选项后,将只找到外部方法调用。

  6. Specify the following options to further narrow the search:指定以下选项以进一步缩小搜索范围:

    • File type文件类型- use the list to select, which file types should be a part of the search. 使用列表选择搜索中应包含的文件类型。In our case, it is JavaScript.在我们的例子中,它是JavaScript

    • Scope作用域- specify where to search: in a project, module, directory, or within a custom scope.指定搜索位置:在项目、模块、目录或自定义范围内。

    • Search target搜索目标- you can select Complete match to match the exact template or other available code elements (in our case it is name).您可以选择“完全匹配”来匹配精确的模板或其他可用的代码元素(在我们的例子中是name)。

      Search target
  7. Click Find.单击“查找”。

WebStorm displays the results in the Find tool window.WebStorm在“查找”工具窗口中显示结果。

Find tool window results

Replace a target structurally从结构上替换目标

  1. From the main menu, select Edit | Find | Replace Structurally.从主菜单中,选择“编辑”|“查找”|“结构替换”。

  2. In the Replace Structurally dialog, add new or existing templates to the search and replace template areas. 在“结构替换”对话框中,将新模板或现有模板添加到“搜索”和“替换模板”区域。You can save the replace template the same way as the search one.可以使用与搜索模板相同的方式保存替换模板。

  3. If you need to add a filter for the variable in the replace template, place a caret at the variable of interest and use the filter area to manage filters.如果需要为替换模板中的变量添加筛选器,请在感兴趣的变量处放置插入符号,并使用筛选器区域管理筛选器。

  4. In the filter area, depending on what you chose as a filter, specify the condition.在“筛选器”区域中,根据您选择的筛选器,指定条件。

    Structural Replace: specify condition
  5. To narrow down your replace results, select the following options:要缩小替换结果的范围,请选择以下选项:

    • Shorten fully-qualified names缩短完全限定名- replaces fully qualified class names with short names and imports.将完全限定的类名替换为短名称并导入。

    • Reformat重新格式化- automatically formats the replaced code.自动设置替换代码的格式。

    • Use static import使用静态导入- uses static import in replacement when possible.尽可能使用静态导入替换。

    After specifying the necessary options, click Find. 指定必要的选项后,单击“查找”。WebStorm displays the results in the Find tool window.WebStorm在“查找”工具窗口中显示结果。

  6. In the Find tool window, you can work with the results further, replacing found items one by one, or all of them at once, or previewing your potential changes.在“查找”工具窗口中,您可以进一步处理结果,逐个或一次全部替换找到的项,或预览可能的更改。

Share search templates共享搜索模板

You can share a search template with your peers by exporting or importing it.您可以通过导出或导入搜索模板与同行共享该模板。

  1. In the Structural Search dialog (Edit | Find | Search Structurally), create a new search template or use the existing one.在“结构搜索”对话框(“编辑”|“查找”|“结构搜索”)中,创建新的搜索模板或使用现有模板。

  2. To export a template, click the Settings button and select Export Template to Clipboard. 要导出模板,请单击the Settings button并选择“将模板导出到剪贴板”。WebStorm adds the XML representation of the template to a clipboard (press Ctrl+Shift+V to see the clipboard's content). WebStorm将模板的XML表示添加到剪贴板(按Ctrl+Shift+V查看剪贴板的内容)。You can share this representation with other developers in chat, email, or a forum.您可以在聊天室、电子邮件或论坛中与其他开发人员共享此表示。

    To import a template, copy (Ctrl+C) the shared XML code from anywhere (email, chat, or a forum) and in the Structural Search dialog, click the Settings button and select Import Template from Clipboard. 要导入模板,请从任何位置(电子邮件、聊天室或论坛)复制(Ctrl+C)共享XML代码,然后在“结构搜索”对话框中,单击the Settings button并选择“从剪贴板导入模板”。WebStorm takes the XML code representation and converts it into a template including variables and a scope if it is present.WebStorm接受XML代码表示,并将其转换为包含变量和范围(如果存在)的模板。

Last modified: 16 July 2021