重构 JavaScript

重构是指在不改变应用行为的情况下更新源代码。重构可帮助您保持代码稳健、干净且易于维护。

移动符号重构

除了移动文件和文件夹之外，GoLand 还允许您移动 JavaScript 顶级符号。移动符号重构适用于 ES6 模块中的类、函数和变量。

移动类、函数或变量

选择要移动的符号。
按 F6 ，或从上下文菜单或主菜单中选择重构 | 移动。或者，选择重构 | 重构此项或按下 Ctrl+Alt+Shift+T ，然后从列表中选择移动。
将打开移动模块成员对话框。
指定目标文件并选择要移动的成员。
默认情况下，GoLand 会自动将成员的可见性提升到所需级别。如果您希望保持可见性级别不变，请在可见性中点击保持不变。

上移类成员重构

向上拉取类成员重构会将类方法上移至类层次结构中的超类。

示例：将类方法移动到超类

假设您有一个类 AccountingDepartment ，它扩展自抽象类 Department。在本示例中，向上拉取类成员重构会将 printMeeting() 方法从 AccountingDepartment 移动到其超类 Department。

                    class Department {
                        name;

                        printName() {
                            console.log("Department name: " + this.name);
                        }
                    }

                    class AccountingDepartment extends Department {
                        printMeeting() {
                            console.log("The Accounting Department meets each Monday at 10am.");
                        }

                        generateReports() {
                            console.log("Generating accounting reports...");
                        }
                    }
                
    

                    class Department {
                        name;

                        printName() {
                            console.log("Department name: " + this.name);
                        }

                        printMeeting() {
                            console.log("The Accounting Department meets each Monday at 10am.");
                        }
                    }

                    class AccountingDepartment extends Department {
                        generateReports() {
                            console.log("Generating accounting reports...");
                        }
                    }
                
    

将类的方法移至超类

将插入符定位在您希望向上拉取成员的类内任意位置。
从主菜单或上下文菜单中选择重构 | 上移成员。将打开上移成员对话框。
从列表中选择希望移动方法的超类。
要将方法上移，请在待上移的成员列表中选中其旁边的复选框。

重命名重构

除了重命名文件和文件夹之外，在任意语言环境中都可用，您也可以重命名类、方法、函数、变量和参数。 GoLand 会更改符号在声明中的名称，并默认更改其在当前项目中的所有用法。

重命名类及其方法

在编辑器中，将插入符放置或选择要重命名的类或方法，然后按 Shift+F6 ，或从上下文菜单中选择重命名。
在打开的重命名对话框中，输入类或方法的新名称。
可选：
- 选中在注释和字符串中搜索和搜索文本出现位置复选框，以修改注释、字符串文字和文本中的类或方法用法。
- 默认情况下，将在整个项目中重命名该类或方法。您可以从列表中选择其他范围。

保持类及包含文件名称一致

当您重命名类时，如果文件名与类名相同，GoLand 也会建议重命名该文件。如果您接受建议，GoLand 会更新其他文件中的 import 语句中此文件的名称。

如果您拒绝此建议，稍后可以随时通过重命名文件意图操作重命名该文件。另一项意图操作会建议将类移动到具有相应名称的新文件中。建议名称的格式由文件名约定列表中选定的样式在代码样式：JavaScript页面上确定。

如果您刚创建了新文件，但在开始编写类或接口时想出了更好的名称，这将非常有用。要调用意图操作，将插入符置于相关类名称上并按 Alt+Enter。

重命名函数、变量和参数

函数、变量和参数的重命名重构可能会在原地执行，您也可以按 Shift+F6 ，以便在重命名对话框中配置重构的范围。

要默认打开重命名对话框，请打开设置对话框（Ctrl+Alt+S ），转到编辑器 | 代码编辑，然后在指定重构选项区域中选择在模态对话框中选项。

在编辑器中，将插入符放置或选择要重命名的函数、变量或参数，然后按 Shift+F6 ，或从上下文菜单中选择重命名。
如果 GoLand 检测到注释或字符串中存在符号的用法，请指定是否也要重命名这些用法。
在画布字段中，输入函数、变量或参数的新名称。
或者：
再次按 Shift+F6 打开重命名对话框。
- 选中在注释和字符串中搜索和搜索文本出现位置复选框，以修改注释、字符串文字和文本中的符号用法。
- By default, the symbol is renamed in the entire project. 您可以从列表中选择其他范围。

重命名常量

在编辑器中，将插入符号放在常量上或选中要重命名的常量，然后按 Shift+F6 ，或从上下文菜单中选择重命名。
在打开的重命名对话框中，键入常量的新名称。
可选：
- 选择在注释和字符串中搜索和搜索文本出现位置复选框，以便在注释、字符串文本和文本中重命名常量的用法。
- By default, the constant is renamed in the entire project. 您可以从列表中选择其他范围。

重命名符号的动态用法

由于 JavaScript 的动态特性，有些情况下动态引用是有效用法，应执行重命名。然而，重命名动态用法通常不是预期的行为。在以下示例中，将 test() 更改为 test1() 在 rename.test() 中是正确的，但在 hello.test() 中则会导致错误。

class Rename{
    test() {
        return 12345;
    }
}

let rename = new Rename();
let hello = window["Test"];

let a = rename.test();
let b = hello.test();
            
     

class Rename{
    test1() {
        return 12345;
    }
}

let rename = new Rename();
let hello = window["Test"];

let a = rename.test1();
let b = hello.test();
            
     

class Rename{
    test1() {
        return 12345;
    }
}

let rename = new Rename();
let hello = window["Test"];

let a = rename.test1();
let b = hello.test1();
            
     

因此，在应用复杂重构之前，GoLand 始终会显示预览窗口。

提取重构

GoLand 提供多种 Extract 重构操作，以引入参数、变量、常量、字段、方法和函数。要运行任一重构操作，请选中要重构的表达式并选择重构 | <target>。您可以选中整个表达式，或将插入符号置于表达式中任意位置，GoLand 将协助您完成选择。

引入参数

使用 Introduce Parameter 重构操作，可用参数替换函数调用中的表达式。 GoLand 将相应更新函数的声明及调用。新参数的默认值可在函数体内初始化或通过函数调用传递。

假设您在函数 calculate_sum(i) 中有一段包含硬编码 1 的代码。使用 Introduce Parameter 重构，可将该硬编码的 1 替换为 i2 参数。新参数 i2 可提取为可选参数或必需参数。

示例 1：引入可选参数

新参数 i2 被提取为可选参数。新参数在 calculate_sum(i) 的函数体中初始化，且 calculate_sum(i) 在 show_sum() 中的调用未发生变化。

请参阅下文中的选择参数类型（可选）。

                        function calculate_sum(i) {
                            alert('Adding ' + 1 + ' to ' + i);
                            return 1 + i;
                        }

                        function show_sum() {
                            alert('Result: ' + calculate_sum(5));
                        }
                    
     

                        function calculate_sum(i, i2) {
                            i2 = i2 || 1;
                            alert('Adding ' + i2 + ' to ' + i);
                            return i2 + i;
                        }

                        function show_sum() {
                            alert('Result: ' + calculate_sum(5));
                        }
                    
     

示例 2：引入必需参数

新参数 i2 被提取为必需参数，并相应更改了 calculate_sum(i) 在 show_sum() 中的调用。

请参阅下文中的选择参数类型（必需）。

                        function calculate_sum(i) {
                            alert('Adding ' + 1 + ' to ' + i);
                            return 1 + i;
                        }

                        function show_sum() {
                            alert('Result: ' + calculate_sum(5));
                        }
                    
     

                        function calculate_sum(i, i2) {
                            alert('Adding ' + i2 + ' to ' + i);
                            return i2 + i;
                        }

                        function show_sum() {
                            alert('Result: ' + calculate_sum(5, 1));
                        }
                    
     

引入参数

在编辑器中，将插入符号置于要转换为参数的表达式中，然后按 Ctrl+Alt+P ，或从上下文菜单中选择重构 | 引入参数。
或者，执行下列操作之一：
- 按 Ctrl+Alt+Shift+T ，然后选择引入参数。
- 转到重构 | 提取 | 参数。
如果当前插入符号位置检测到多个表达式，请从表达式列表中选择所需表达式。
如果找到所选表达式的多个实例，请从发现多个位置列表中选择仅替换此处或替换所有位置。
最后，将显示用于配置重构的弹出窗口。
选中生成 JSDoc 可生成 JSDoc 注释块。如果需要指定自定义默认参数值，此功能可能会很有帮助。
选择新参数的类型（可选或必需），并在适用时指定其默认值：
- 如果选中了可选参数复选框，则将在函数体中使用默认值初始化该参数。
  请参阅上方的 Introduce Parameter 示例 1。
- 如果清除了可选参数复选框，默认参数值将通过现有函数调用传递。所有函数调用将根据新的函数签名进行更改，并会在函数体中添加参数初始化。
  请参阅上方的 Introduce Parameter 示例 2。
最初，GoLand 将在调用重构操作的表达式作为默认值接受。在大多数情况下，您无需更改此默认值。如仍需更改，请在 JSDoc 注释中以格式 @param <参数名称> - <默认值> 指定新的默认值。
通过在列表中双击接受建议的参数名之一，或在红色画布字段中指定自定义名称。准备就绪后，请按 Enter。
还请注意，在 ES6 代码中，将应用新的默认函数参数语法 function calculate_sum(i, i2 = 1) ，而不会使用 i2 = i2 || 1;。从 https://developer.mozilla.org 网站了解有关默认函数参数的更多信息。

选择重构模式

您可以直接在编辑器中（以原位模式）如上所述提取参数，也可以使用引入参数对话框。这两种方法相当相似，其区别如下：

预览重构结果。
在对话框中，您可以单击预览，并在查找工具窗口的专用选项卡中查看预期更改。在原位模式下，此功能不可用。
指定默认参数值。
在对话框中，GoLand 会在值字段中建议默认参数值，您可以接受建议或指定其他值。在原位模式下，GoLand 会将调用重构的位置上的表达式视为默认参数值。如需指定其他值，必须使用 JSDoc 注释块。

默认情况下，GoLand 以原位模式运行 Introduce Parameter 重构。要使用提取参数对话框，请打开设置对话框（Ctrl+Alt+S ），转到编辑器 | 代码编辑，并在重构区域中选择在模态对话框中选项。

引入变量

使用 Introduce Variable 重构将表达式替换为函数作用域变量（var）或块级作用域变量（let）。此重构可使源代码更易于阅读和维护。

假设您有一个函数，其中某个表达式在 return 语句中为部分硬编码：

                    Parenizor.method('toString', function ())
                    {
                        return '(' + this.getValue() + ')';
                    }
                
   

通过 Introduce Variable 重构，您可以将 '(' + this.getValue() + ')' 表达式替换为变量，例如 string。提取变量的作用域取决于声明时使用的语句 var 或 let 以及新变量声明时的上下文（在函数内部或外部）。

示例 1：使用 let 语句声明引入的块级作用域变量

变量 string 是从 '(' + this.getValue() + ')' 表达式中提取的，该表达式位于 return 语句中。新变量通过 let 语句在 Parenizor.method('toString', function ()) 中声明。

                        Parenizor.method('toString', function ())
                        {
                            return '(' + this.getValue() + ')';
                        }
                    
     

                        Parenizor.method('toString', function ())
                        {
                            let string = '(' + this.getValue() + ')';
                            return string;
                        }
                    
     

示例 2：引入变量并在函数外部声明

变量 appName 是从 navigator.appName 表达式中提取的，并使用 var 语句在任何函数之外进行声明。

                        var browserName = "N/A";
                        if (navigator.appName.indexOf("Netscape") != -1) {
                            browserName = "NS";
                        } else if (navigator.appName.indexOf("Microsoft") != -1) {
                            browserName = "MSIE";
                        } else if (navigator.appName.indexOf("Opera") != -1) {
                            browserName = "O";
                        }
                    
     

                        var browserName = "N/A";
                        var appName = navigator.appName;
                        if (appName.indexOf("Netscape") != -1) {
                            browserName = "NS";
                        } else if (appName.indexOf("Microsoft") != -1) {
                            browserName = "MSIE";
                        } else if (appName.indexOf("Opera") != -1) {
                            browserName = "O";
                        }
                    
     

引入变量

在编辑器中，选中要转换为变量的表达式并按 Ctrl+Alt+V ，或从上下文菜单中选择重构 | 引入变量。
或者，执行以下操作之一：
- 按 Ctrl+Alt+Shift+T 并选择引入变量。
- 转到重构 | 提取 | 变量。
如果在当前位置检测到多个表达式，请从表达式列表中选择所需表达式。
如果找到多个所选表达式的出现位置，请从发现多个位置列表中选择仅替换此处或替换所有位置。
最后，会显示用于配置重构的弹出窗口。
从列表中选择用于新变量声明的语句：
- 选择 var 以引入函数作用域变量。
- 选择 let 以引入块级作用域变量，请参阅上文中的示例 2。
- 选择 const 以引入常量。
通过双击列表中的建议参数名之一来接受，或在红色画布字段中指定自定义名称。准备就绪后按 Enter。

选择重构模式

您可以直接在编辑器中（以原位模式）如上所述提取变量，也可以使用提取变量对话框。默认情况下，GoLand 以原位模式运行 Introduce Variable 重构。要使用提取变量对话框，请打开设置对话框（Ctrl+Alt+S ），转到编辑器 | 代码编辑，并在重构区域中选择在模态对话框中选项。

引入常量

使用 Introduce Constant 重构将表达式替换为常量。此重构可使源代码更易于阅读和维护。它还可以帮助您避免使用硬编码常量，同时没有对其值或用途进行说明。

在类中，您可以引入只读字段，或者在有多个合适作用域时选择其中一个。在其他上下文中，GoLand 仅引入局部常量。

示例 1：为引入的常量选择作用域

假设您有一个类 AccountingDepartment ，其中方法 printName() 中的 "Department name :" 是硬编码的。

                class AccountingDepartment {
                    name;

                    printName() {
                        console.log("Department name: " + this.name);
                    }

                    printMeeting() {...
                    }

                    generateReports() {...
                    }
                }
            
   

GoLand 可以将新常量引入为局部常量，并在 printName() 函数内部声明，或将其作为全局或模块常量，在类的外部声明。

                        class AccountingDepartment {
                            name;

                            printName() {
                                const departmentName = "Department name: ";
                                console.log(departmentName + this.name);
                            }

                            printMeeting() {...
                            }

                            generateReports() {...
                            }
                        }
                    
     

                        const departmentName = "Department name: ";

                        class AccountingDepartment {
                            name;

                            printName() {
                                console.log(departmentName + this.name);
                            }

                            printMeeting() {...
                            }

                            generateReports() {...
                            }
                        }

                    
     

示例 2：引入常量但不选择作用域

如果从类外部调用 Introduce Constant 重构，GoLand 将自动引入一个局部变量，并在当前函数或代码块中声明。

                        let output = MyFunction(5, 8);
                        document.writeln("The value is .".output);

                        let output = MyFunction(5, 8);
                        const Value = "The value is ";
                        document.writeln(Value.output);

引入常量

在编辑器中，选择要转换为常量的表达式，然后按 Ctrl+Alt+C ，或从上下文菜单中选择重构 | 引入常量。
或者，执行以下操作之一：
- 按 Ctrl+Alt+Shift+T 并选择引入常量。
- 转到重构 | 提取 | 常量。
如果在当前光标位置检测到多个表达式，请从表达式列表中选择所需表达式。
如果从类内部调用重构操作，请引入只读字段或选择新常量的作用域，参见示例 1。
对于全局常量，可以找到所选表达式的多个出现位置。从发现多处重复列表中选择仅替换此项或替换所有项。
通过双击列表中的建议参数名称接受其中之一，或在红色背景字段中指定自定义名称。准备就绪后按 Enter。

引入字段

Introduce Field 重构会声明一个新字段，并使用所选表达式进行初始化。原始表达式将被该字段的使用替换。

在以下示例中，引入了相同的字段 _calcArea。这些示例展示了初始化引入字段的三种不同方式。

示例 1：在封闭方法中初始化引入字段

                        class Rectangle {
                            constructor(height, width) {
                                this.height = height;
                                this.width = width;
                            }

                            get area() {
                                return this.calcArea();
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }
                    
     

                        class Rectangle {
                            constructor(height, width) {
                                this.height = height;
                                this.width = width;
                            }

                            _calcArea;

                            get area() {
                                this._calcArea = this.calcArea();
                                return this._calcArea;
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }                        
     

示例 2：在字段声明中初始化提取字段

                        class Rectangle {
                            constructor(height, width) {
                                this.height = height;
                                this.width = width;
                            }

                            get area() {
                                return this.calcArea();
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }
                    
     

                        class Rectangle {
                            constructor(height, width) {
                                this.height = height;
                                this.width = width;
                            }

                            _calcArea = this.calcArea();

                            get area() {
                                return this._calcArea;
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }                        
     

示例 3：在类的构造函数中初始化提取字段

                        class Rectangle {
                            constructor(height, width) {
                                this.height = height;
                                this.width = width;
                            }

                            get area() {
                                return this.calcArea();
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }
                    
     

                        class Rectangle {
                            constructor(height, width) {
                                this._calcArea = this.calcArea();
                                this.height = height;
                                this.width = width;
                            }

                            _calcArea;

                            get area() {
                                return this._calcArea;
                            }

                            calcArea() {
                                return this.height * this.width;
                            }
                        }
                    
     

引入字段

在编辑器中，选择要转换为字段的表达式，然后按 Ctrl+Alt+F ，或从上下文菜单中选择重构 | 引入字段。
或者，执行以下操作之一：
- 按 Ctrl+Alt+Shift+T 并选择引入字段。
- 转到重构 | 提取 | 字段。
在弹出窗口中，选择新字段将被初始化的位置：
- 当前方法，参见上文示例 1。
- 字段声明，参见上文示例 2。
- 构造函数，参见上文示例 3。
通过双击列表中的建议参数名称接受其中之一，或在红色背景字段中指定自定义名称。准备就绪后按 Enter。

选择重构模式

默认情况下，GoLand 会直接在编辑器中运行 Introduce Field 重构（即原地模式），如上所述。

如需在重构时使用 Extract Field 对话框，请打开设置对话框（Ctrl+Alt+S ），转到编辑器 | 代码编辑，并在重构区域中选择在模态对话框中选项。

提取方法

Extract Method 重构允许使用提取的代码创建一个命名方法或函数。当调用 Extract Method 重构时，GoLand 会检测所选代码片段的输入变量以及其输出变量。检测到的输出变量将作为提取方法或函数的返回值使用。

在以下示例中，从 c = a + b; 表达式中提取了一个函数。

示例 1：从另一个函数内部的表达式中提取全局作用域函数

执行重构操作的 c = a + b; 表达式位于 MyFunction() 函数内部。选择了 global 目标作用域。

示例 1.1：生成函数声明

                        function MyFunction(a, b) {
                            c = a + b;
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);
                    
     

                        function extracted(a, b) {
                            c = a + b;
                        }

                        function MyFunction(a, b) {
                            extracted(a, b);
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);
                    
     

示例 1.2：在表达式内部声明提取的函数

                        function MyFunction(a, b) {
                            c = a + b;
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);
                    
     

                        let extracted = function (a, b) {
                            c = a + b;
                        };

                        function MyFunction(a, b) {
                            extracted(a, b);
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);
                    
     

示例 2：从不在任何函数中的表达式中提取全局作用域函数

执行重构操作的 c = a + b; 表达式不在任何函数中。因此，无法选择目标作用域。

示例 2.1：生成函数声明

c = a + b;

                        function extracted() {
                            c = a + b;
                        }

                        extracted();

示例 2.2：在表达式内部声明提取的函数

c = a + b;

                        let extracted = function () {
                            c = a + b;
                        };
                        extracted();
                    
     

示例 3：提取一个在封闭函数内部定义的函数

执行重构操作的 c = a + b; 表达式位于 MyFunction() 函数内部。选择了函数 MyFunction 目标作用域。

                        function MyFunction(a, b) {
                            c = a + b;
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);
                    
     

                        function MyFunction(a, b) {
                            function extracted() {
                                c = a + b;
                            }

                            extracted();
                            return (c * c);
                        }

                        result = MyFunction(4, 6);
                        document.write(result);

                    
     

提取函数

在编辑器中，选择要转换为函数的代码片段，然后按 Ctrl+Alt+M 或从上下文菜单中选择重构 | 提取方法。
或者，执行以下操作之一：
- 按 Ctrl+Alt+Shift+T 并选择提取方法。
- 转到重构 | 提取 | 方法。
所选的代码片段可以是一组语句或代码中某处使用的表达式。
如果所选表达式位于函数内部，请从列表中选择目标作用域：
- 如果选择了 global ，生成的函数将在所有函数之外声明。请参见上方的示例 1。
- 要在当前封闭函数内定义提取出的函数，请选择 function <当前外层函数名称>。请参见上方的示例 3。
要打开包含更多选项的 Extract Method 对话框，请再次按下 Ctrl+Alt+M。在此对话框中，您可以选择将提取出的函数通过生成的 function declaration 声明，或者以内联表达式的形式声明。请参见上方的示例。

默认打开“提取函数”对话框

打开设置对话框（Ctrl+Alt+S ），转到编辑器 | 代码编辑，并在重构区域中选择在模态对话框中选项。

提取超类

Extract Superclass 重构会基于当前类的成员创建一个新的抽象类。创建的类会自动进行扩展。

假设您有一个类 AccountingDepartment ，并预期其中的 printName() 方法将被重复使用。

                    class AccountingDepartment {
                        name;

                        printName() {
                            console.log("Department name: " + this.name);
                        }

                        printMeeting() {
                            console.log("The Accounting Department meets each Monday at 10am.");
                        }

                        generateReports() {
                            console.log("Generating accounting reports...");
                        }
                    }
                
   

您可以提取一个超类 Department ，并将 printName 与 名称 字段包含在其中。

                    class Department {
                        name;

                        printName() {
                            console.log("Department name: " + this.name);
                        }
                    }

                    class AccountingDepartment extends Department {
                        printMeeting() {
                            console.log("The Accounting Department meets each Monday at 10am.");
                        }

                        generateReports() {
                            console.log("Generating accounting reports...");
                        }
                    }
                
   

提取超类

将插入符号置于您希望从中提取超类的类内任意位置。
从主菜单中选择重构 | 提取 | 超类，或者从上下文菜单中选择重构 | 提取超类。将打开提取超类对话框。
指定新超类的名称，并选中要包含在其中的类成员对应的复选框。可选：标记要设为抽象的成员。
在目标文件字段中，指定新类所在文件的位置。默认情况下，该字段显示调用重构时的当前文件路径。
选择提取超类。 GoLand 会创建一个新类，并使用 extends 标记源类。
要创建一个超类，并在方法的参数中用该超类替换对源类的引用，请选择提取超类并在可能处使用。 GoLand 会在查找工具窗口的重构预览面板中显示建议的变更。

引入对象或数组解构

解构可让您轻松地将数组和对象中的值解包到变量中。此功能具有非常简洁的语法，在需要在应用程序中传递数据时经常使用。有关详情，请参见 Exploring ES6。

在 GoLand 中，您可以使用意图操作 Alt+Enter 来调用解构。使用 Replace with object/array destructuring 操作时，原始赋值将被移除。若要保留赋值，请使用 Introduce object/array destructuring。

替换原始赋值

将插入符号置于数组或对象中的某个值上并按下 Alt+Enter。
从列表中选择使用对象解构替换或替换为数组解构。
如果未使用数组或对象中的某些值，这些元素将被跳过：

保留原始赋值

将插入符号置于数组或对象中的某个值上并按下 Alt+Enter。
从列表中选择引入对象解构或引入数组解构。
在使用 React 类组件时，此意图操作非常实用：

为函数生成解构参数

将插入符号置于函数参数上并按下 Alt+Enter。
从列表中选择将参数转换为对象。

提取 Vue 组件

使用 Extract Vue Component 重构可从现有组件中提取新的 Vue.js 组件，无需复制和粘贴。请注意，此重构仅支持就地操作，请确保在编辑器 | 代码编辑设置页面中已选中在编辑器中重构选项 Ctrl+Alt+S。

提取 Vue.js 组件

选择要提取的代码片段，并从其上下文菜单中选择重构 | 提取 Vue 组件，或从主菜单中选择重构 | 提取 | 提取 Vue 组件。
或者，使用专用意图操作：选择要提取的模板片段，按下 Alt+Enter ，然后从列表中选择提取 Vue 组件。
输入新组件的名称。如果该名称已被使用或无效，GoLand 会显示警告。否则，将创建一个新的单文件组件并导入到父组件中。

内联重构

Inline 重构与 Extract 重构相对。

示例 1：内联变量

Inline Variable 重构将冗余的变量或常量用其初始值替代。此重构类型仅适用于块作用域和函数作用域的变量。此类型的重构仅适用于块级作用域和函数级作用域的变量。

                    Parenizor.method('toString', function () {
                        var string = '(' + this.getValue() + ')';
                        return string;
                    }                            
    

                    Parenizor.method('toString', function () {
                        return '(' + this.getValue() + ')';
                    }
                
    

示例 2：内联函数

内联方法／内联函数重构会将方法或函数的主体放入其调用者的代码中，并删除该方法／函数本身。

在下方示例中， Sum() 的主体被放入 Multiplication() 和 Division() 的主体中。

                    function Sum(a, b) {
                        return a + b;
                    }

                    function Multiplication(a, b) {
                        c = Sum(a, b);
                        d = c * c;
                        return d;
                    }

                    function Division(a, b) {
                        c = Sum(a, b);
                        d = Multiplication(a, b);
                        result = c / d;
                        return result;
                    }
                
    

                    function Multiplication(a, b) {
                        c = a + b;
                        d = c * c;
                        return d;
                    }

                    function Division(a, b) {
                        c = a + b;
                        d = Multiplication(a, b);
                        result = c / d;
                        return result;
                    }

                
    

运行内联重构

在编辑器中，将插入符号置于要内联的符号上，然后按 Ctrl+Alt+N ，或从上下文菜单或主菜单中选择重构 | 内联。

更改签名重构

使用更改签名重构来更改函数名称，添加、删除、重新排序或重命名参数，并在调用层级中传播新参数。

您也可以使用引入参数重构来添加参数。

以下示例展示了运行更改签名重构的不同方式。在所有情况下，函数 result() 被重命名为 generate_result() ，并向该函数添加了一个新参数 input。示例展示了根据重构设置，函数调用、调用该函数的函数 show_result() 以及其他代码片段可能受到的影响。

示例 1：重命名函数、添加参数并通过函数调用传递该参数

在此示例中，函数 result() 被重命名为 generate_result() ，添加了参数 input ，并在函数调用中传递了值 100 作为参数。

                    function result() {
                    }

                    function show_result() {
                        alert('Result: ' + result());
                    }
                
    

                    function generate_result(input) {
                    }

                    function show_result() {
                        alert('Result: ' + generate_result(100));
                    }
                
    

示例 2：重命名函数并添加默认参数

在此示例中，函数 result() 被重命名为 generate_result()。添加了一个默认参数 input ，其值为 100。新参数在 generate_result() 中以 ES6 语言级别格式 function generate_result(input = 100) {} 或 ES5 格式 input = input || 100 进行初始化。

                    function result() {
                    }

                    function show_result() {
                        alert('Result: ' + result());
                    }
                
    

                    function generate_result(input = 100) {
                    }

                    function show_result() {

                    alert('Result: ' + generate_result());
                    }

示例 3：重命名函数、添加默认参数并将该参数传播到函数调用中

                    function result() {
                    }

                    function show_result() {
                        alert('Result: ' + result());
                    }
                
    

                    function generate_result(input = 100) {
                    }

                    function show_result() {

                    alert('Result: ' + generate_result());
                    }

调用更改签名

在编辑器中，将插入符号放在要重构的函数名称上，然后按 Ctrl+F6 ，或从上下文菜单或主菜单中选择重构 | 更改签名。将打开更改签名对话框。

重命名函数

在更改签名对话框 Ctrl+F6 中，编辑名称字段。

管理函数参数

在更改签名对话框 Ctrl+F6 中，使用参数表及其右侧的按钮：
- 要添加新参数，请点击 Alt+Insert ，然后指定新参数的名称及其默认值，或要通过函数调用传递的值。
  请参阅上方的示例 1 和示例 2。
- 要删除参数，请点击对应行中的任意单元格并点击 Alt+Delete。
- 要重新排列参数，请使用 Alt+Up 和 Alt+Down。
- 要重命名参数，请编辑名称字段。
- 如有必要，可将新参数传播到调用当前函数的函数中。

沿调用层级传播参数

在更改签名对话框 Ctrl+F6 中，选择参数并点击。将打开选择要传播新参数的方法对话框。左侧窗格显示函数调用的层级结构。选择函数后，右侧窗格将分别在调用方方法和被调用方方法字段中显示该函数的代码及其调用的函数的代码。
请参阅上文中的示例 3。
在左侧窗格中，选中要传播参数的函数旁的复选框，然后单击确定。

预览更改并完成重构

在更改签名对话框中，单击预览。
在重构预览选项卡中的 “查找”工具窗口里，查看预期的更改，完成必要的调整后，单击执行重构。

将默认导出转换为命名导出

对类、函数、常量变量、字符串、对象和类型，您可以将 export default 语句替换为具名的 export 语句，并相应地更新对应的 import 语句。

如果符号已重新导出，则会同步更新对应的 export 语句。

可以从 export default 和 import 语句中调用此重构操作。

将光标置于 export default 语句处或导出的名称上，按 Alt+Enter ，然后选择将默认导出转换为具名导出。要切换预览，请按 Ctrl+Q。
在 import 语句中，将光标置于导入项的名称处，按 Alt+Enter ，然后选择将默认导出转换为具名导出。预览窗口（Ctrl+Q ）会显示 import 语句的更新方式。

将命名导出转换为默认导出

对类、函数、常量变量、字符串、对象和类型，您可以将具名的 export 语句替换为 export default 语句，并相应地更新对应的 import 语句。

可以从 export default 和 import 语句中调用此重构操作。

在 export 语句中，将光标置于导出项的名称上，按 Alt+Enter ，然后选择将具名导出转换为默认导出。要切换预览，请按 Ctrl+Q。
在 import 语句中，将光标置于导入项的名称处，按 Alt+Enter ，然后选择将具名导出转换为默认导出。预览窗口（Ctrl+Q ）会显示 import 语句的更新方式。

最后修改日期： 2025年 9月 26日