WebStorm 2017.1 Help

Extract Method

Basics

When the Extract Method refactoring is invoked in the JavaScript context , WebStorm analyses the selected block of code and detects variables that are the input for the selected code fragment and the variables that are output for it.

The detected output variable is used as a return value for the extracted function.

Example

BeforeAfter
function MyFunction(a,b) { c = a + b; d = c * c; return d; }
function Sum(a,b) { return a + b; } function MyFunction(a,b) { c = sum(a,b); d = c * c; return d; }
BeforeAfter
function MyFunction(a,b) { c = a + b; d = c * c; return d; }
function Sum(a,b) { return a + b; } function MyFunction(a,b) { c = sum(a,b); d = c * c; return d; }

To extract a function

  1. In the editor, select a block of code to be transformed into a function.
  2. On the main menu or on the context menu of the selection, choose Refactor | Extract Method or press Ctrl+Alt+M.
  3. In the Extract Function dialog box that opens, specify the name of the new function.
  4. To have the new function defined through a function expression, select the Declare functional expression check box.
  5. In the Parameters area, configure the set of variables to be passed to the new function as parameters. By default, all the variables from the specified scope are listed.
    • To have a variable included in the parameter set, select the check box next to it.
    • To change the order of parameters, use the Move Up and Move Down buttons.
  6. View and check the declaration of the function to be generated in the Signature preview read-only area.

See Also

Last modified: 17 July 2017