llms.txt: machine-readable documentation index. Markdown version of this page is also available.

IntelliJ IDEA 2026.3 Help

重构 JavaScript

重构 是指在不改变应用程序行为的情况下更新源代码。 重构有助于让代码保持稳健、 避免重复代码 ,且易于维护。

移动符号重构

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

移动类、函数或变量

  1. 选择要移动的符号。

  2. 按 F6 或从上下文菜单或主菜单中选择 重构 | 移动。 或者,选择 重构 | 对此进行重构 或按 Ctrl+Alt+Shift+T ,然后从列表中选择 移动。

    移动模块成员 对话框将打开。

  3. 指定目标文件并选择要移动的成员。

  4. 默认情况下,IntelliJ IDEA 会自动将成员的可见性提升到所需级别。 如果要保持可见性级别不变,请在 可见性 中点击 按原样。

向上拉取类成员重构

Pull Class Members Up 重构将类方法在类层次结构中向上移动——从当前类移动到超类。

例如:将类方法移动到超类

假设您有一个类 AccountingDepartment 扩展一个抽象类 Department。 在此示例中, Pull Class Members Up 重构将 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..."); } }

将类的方法移到超类

  1. 将文本光标放在要将成员上拉的类内任意位置。

  2. 请选择 重构 | 上移成员 从主菜单或上下文菜单中。 将打开 向上拉取成员 对话框。

  3. 从列表中选择您要移动方法的超类。

  4. 要向上拉取某个方法,请在 要上移的成员 列表中选中其旁边的复选框。

重命名重构

除了 重命名文件和文件夹之外,您还可以重命名类、方法、函数、变量和参数。 IntelliJ IDEA 会更改符号在其声明中的名称,并默认更改当前项目中的所有用法。

重命名类及其方法

  1. 在编辑器中,将插入点放在要重命名的类或方法上,或选择它,然后按 Shift+F6 或从上下文菜单中选择 重命名。

  2. 在打开的 重命名 对话框中,输入类或方法的新名称。

  3. 可选:

    • 请选择 在注释和字符串中搜索 和 搜索文本出现位置 复选框以便重命名类或方法在注释、字符串字面量和文本中的用法。

    • 默认情况下,类或方法会在整个项目中被重命名。 可以从列表中选择另一个 作用域。

保持类名和所含文件一致性

重命名类时,如果文件具有相同名称,IntelliJ IDEA 也会建议重命名该文件。 如果接受该建议,IntelliJ IDEA 会在其他文件的 import 语句中更新此文件的名称。

重命名类和文件

如果拒绝此建议,之后可以随时使用 重命名文件 意图操作重命名该文件。 另一项意图操作会建议将类移动到具有相应名称的新文件中。 建议名称的格式由 文件名约定 列表中选定的样式决定,位于 代码样式:JavaScript页面。

ws_js_refactoring_rename_file_intention_custom_naming_convention.png

如果刚刚创建了一个新文件,但在其中开始键入类或接口时又想出了更好的名称,此操作会很有用。 要调用意图操作,请将文本光标置于相关类的名称处并按下 Alt+Enter。

重命名函数、变量和参数

重命名函数

针对函数/方法、变量和形参的 重命名 重构可能会就地执行,但可以按 Shift+F6 在 重命名 对话框中配置重构作用域。

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

重构设置:在模态对话框中打开设置
  1. 在编辑器中,将插入点放在要重命名的函数、变量或参数上,或选择它,然后按 Shift+F6 或从上下文菜单中选择 重命名。

  2. 如果 IntelliJ IDEA 在注释或字符串中检测到符号的用法,请指定是否也要重命名这些用法。

  3. 在带有 canvas 的字段中,输入函数、变量或参数的新名称。

  4. 或者:

    请再次按下 Shift+F6 以打开 重命名 对话框。

    • 选中 在注释和字符串中搜索 和 搜索文本出现位置 复选框,以重命名符号在注释、字符串字面量和文本中的用法。

    • 默认情况下,将在整个项目中重命名该符号。 可以从列表中选择另一个 作用域。

重命名常量

  1. 在编辑器中,将插入点放在要重命名的常量上,或选择它,然后按 Shift+F6 或从上下文菜单中选择 重命名。

  2. 在打开的 重命名 对话框中,输入常量的新名称。

  3. 可选:

    • 选中 在注释和字符串中搜索 和 搜索文本出现位置 复选框,以便重命名注释、字符串文字和文本中的常量用法。

    • 默认情况下,将在整个项目中重命名该常量。 可以从列表中选择另一个 作用域。

重命名符号的动态用法

由于 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();

IntelliJ IDEA 始终会在应用复杂重构前显示 预览 窗口。

  • 要显示符号的动态用法,请按 显示动态用法切换按钮

  • 默认情况下,在 重构预览 工具窗口中,所有符号的动态用法都会被标记为排除,并分组到 代码中对<symbol>的动态引用 节点下。 要将重构应用于某个用法,请从其上下文菜单中选择 包含。

动态用法的重构预览

提取重构操作

IntelliJ IDEA 提供多种 提取 重构操作,用于引入形参、变量、常量、字段、方法和函数/方法。 要运行这些重构操作中的任意一个,请选择要重构的表达式,然后选择 重构 | <target>。 可以选择整个表达式,或者将文本光标放在表达式内的任意位置,IntelliJ IDEA 会帮助完成选择。

引入形参

使用 引入形参 重构将函数/方法调用中的表达式替换为形参。 IntelliJ IDEA 将相应更新函数/方法的声明及其调用。 新形参的默认值可以在函数/方法主体内初始化,或通过函数/方法调用传递。

假设您有一段代码,其中在函数 1 中硬编码了 calculate_sum(i)。 通过引入参数重构,您可以用一个 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)); }

引入参数

  1. 在编辑器中,将文本光标放在要转换为形参的表达式内,然后按 Ctrl+Alt+P ,或从上下文菜单中选择 重构 | 引入参数。

    或者,执行以下操作之一:

    • 按 Ctrl+Alt+Shift+T 并选择 引入形参。

    • 前往 重构 | 提取 | 参数。

  2. 如果在当前文本光标位置检测到多个表达式,请从 表达式 列表中选择所需的表达式。

    ws_js_extract_parameter_select_expression.png
  3. 如果找到所选表达式的多个出现位置,请从 找到多个出现位置 列表中选择 仅替换此处 或 替换所有出现位置。

    ws_js_extract_parameter_multiple_occurrences.png

    最后,会显示用于配置重构的弹出窗口。

    ws_js_extract_parameter_specify_parameter_name_and_type.png
  4. 选择 生成 JSDoc 以生成 JSDoc 注释块。 如果需要指定自定义默认形参值,这可能会有所帮助。

  5. 选择新参数的类型(optional 或 required )并指定其默认值(如果适用):

    • 如果选中 可选形参 复选框,形参将在函数/方法主体中使用默认值进行初始化。

      请参见 Introduce Parameter example 1 上方。

    • 如果清除 可选形参 复选框,默认形参值将通过现有函数/方法调用传递。 所有函数/方法调用都将根据新的函数/方法签名进行更改,并且会在函数/方法主体中添加形参初始化。

      请参见上面的 Introduce Parameter example 2。

    最初,IntelliJ IDEA 会将在调用重构的位置处的表达式作为默认值。 在大多数情况下,您无需更改它。 如果仍有必要,请在 JSDoc 注释中以 @param <parameter name> - <default value> 格式指定另一个默认值。

  6. 在列表中双击建议的形参名称之一以接受它,或在带画布的字段中指定自定义名称。 按 Enter 准备。

    ws_js_extract_parameter_result.png

    请注意,在 ES6 代码中,将应用新的默认函数参数语法 function calculate_sum(i, i2 = 1) ,而不是 i2 = i2 || 1;。 了解有关默认函数参数的更多信息,详见 https://developer.mozilla.org 网站。

选择重构模式

您可以直接在编辑器中(在就地模式中)提取参数 ,如上所述或使用 引入参数对话框。 这两种方法非常相似,区别如下:

  • 预览重构的结果。

    在对话框中,可以点击 预览 ,并在 查找 工具窗口的专用选项卡中检查预期更改。 在就地模式下,此功能不可用。

  • 指定默认参数值。

    在对话框中,IntelliJ IDEA 会在 值 字段中建议默认形参值,可以接受该建议或指定其他值。 在就地模式下,IntelliJ IDEA 将调用重构的位置处的表达式视为默认形参值。 要指定另一个值,必须使用 JSDoc 注释块。

默认情况下,IntelliJ IDEA 以就地模式运行引入参数重构。 要使用 提取参数 对话框,请打开 设置 对话框(Ctrl+Alt+S ),转到 编辑器 | 代码编辑 ,并在 重构 区域中选择 在模态对话框中 选项。

引入变量

使用 Introduce Variable 重构将表达式替换为 function-scoped variable (var) 或 block-scoped variable (let)。 此重构使源代码更易于阅读和维护。

假设您在 return 语句中有一个部分硬编码的表达式的函数:

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

借助引入变量重构,您可以用变量替换 '(' + this.getValue() + ')' 表达式,例如, 字符串。 提取变量的作用域取决于其声明中使用的语句 var 或 let 以及新变量声明的上下文(在函数内部或外部)。

示例 1:用 let 声明引入块作用域变量

从 '(' + 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:引入一个变量并在任何函数之外声明它

从 navigator.appName 表达式中提取了一个变量 appName ,并在任何函数之外用 var 语句声明。

let 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"; }
let browserName = "N/A"; let 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"; }

引入变量

  1. 在编辑器中,选择要转换为变量的表达式,然后按 Ctrl+Alt+V 或从上下文菜单中选择 重构 | 引入变量。

    或者,执行以下操作之一:

    • 按 Ctrl+Alt+Shift+T 并选择 引入变量。

    • 前往 重构 | 提取 | 变量。

  2. 如果在当前文本光标位置检测到多个表达式,请从 表达式 列表中选择所需的表达式。

    提取变量 - 选择表达式
  3. 如果找到所选表达式的多个出现位置,请从 找到多个出现位置 列表中选择 仅替换此处 或 替换所有出现位置。

    提取变量 - 多个匹配项

    最后,会显示用于配置重构的弹出窗口。

  4. 从列表中选择用于声明新变量的语句:

    提取变量 - 选择声明类型
  5. 在列表中双击建议的形参名称之一以接受它,或在带画布的字段中指定自定义名称。 按 Enter 准备。

选择重构模式

您可以直接在编辑器中(就地模式)提取变量 ,如上所述或使用 提取变量对话框。 默认情况下,IntelliJ IDEA 会在就地模式下运行引入变量重构。 要使用 提取变量 对话框,请打开 设置 对话框(Ctrl+Alt+S ),转到 编辑器 | 代码编辑 ,并在 重构 区域中选择 在模态对话框中 选项。

引入常量

使用 Introduce Constant 重构将表达式替换为 常量。 此重构使源代码更易于阅读和维护。 它还有助于避免使用没有关于其值或用途说明的硬编码常量。

在类内部,可以引入 readonly 字段;如果有多个适用的作用域,也可以选择一个作用域。 在其他上下文中,IntelliJ IDEA 仅引入局部常量。

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

假设您有一个类 AccountingDepartment ,其方法 printName() 中 "部门名称:" 是硬编码的。

class AccountingDepartment { name; printName() { console.log("Department name: " + this.name); } printMeeting() {... } generateReports() {... } }

IntelliJ IDEA可以作为局部变量在 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 重构,IntelliJ IDEA 将自动引入一个局部变量,并在当前函数或块中声明它。

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

引入常量

  1. 在编辑器中,选择要转换为常量的表达式,然后按 Ctrl+Alt+C ,或从上下文菜单中选择 重构 | 引入常量。

    或者,执行以下操作之一:

    • 按 Ctrl+Alt+Shift+T 并选择 引入常量。

    • 前往 重构 | 提取 | 常量。

  2. 如果在当前文本光标位置检测到多个表达式,请从 表达式 列表中选择所需的表达式。

    引入常量:选择表达式
  3. 如果从类内部调用重构,请引入 readonly 字段或选择新常量的作用域,参见 示例 1。

    引入常量:选择作用域

    对于全局常量,可以找到所选表达式的多个出现。 从 找到多个出现位置 列表中选择 仅替换此处 或 替换所有出现位置。

    引入常量:全局常量的多次出现
  4. 在列表中双击建议的形参名称之一以接受它,或在带画布的字段中指定自定义名称。 按 Enter 准备。

    引入常量:选择名称

引入字段

引入字段 重构会声明一个新字段,并使用所选表达式对其进行初始化。 原始表达式被字段的用法替换。

在下面的示例中,引入了相同的字段, _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; } }

介绍一个字段

  1. 在编辑器中,选择要转换为字段的表达式并按 Ctrl+Alt+F 或从上下文菜单中选择 重构 | 引入字段。

    或者,执行以下操作之一:

    • 按 Ctrl+Alt+Shift+T 并选择 引入字段。

    • 前往 重构 | 提取 | 字段。

  2. 在弹出窗口中,选择新字段将在哪里初始化:

    • 当前方法 ,请参阅上面的 Example 1。

    • 字段声明 ,请参见上面的 示例 2。

    • 构造函数 ,请参阅上面的 Example 3。

    就地提取字段
  3. 在列表中双击建议的形参名称之一以接受它,或在带画布的字段中指定自定义名称。 按 Enter 准备。

选择重构模式

默认情况下,IntelliJ IDEA 会直接在编辑器中(以就地模式)运行“引入字段”重构, 如上所述。

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

提取方法

提取方法 重构可让你使用提取的代码创建带名称的方法或函数/方法。 调用 提取方法 重构时,IntelliJ IDEA 会检测作为所选代码段输入的变量以及作为其输出的变量。 检测到的输出变量将用作提取的方法或函数/方法的返回值。

在下面的示例中,函数是从 c = a + b; 表达式中提取的。

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

调用重构的 c = a + b; 表达式位于 MyFunction() 函数/方法内部。 已选择 全局 目标作用域。

示例 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() 函数/方法内部。 已选择 function 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);

提取函数

  1. 在编辑器中,选择要转换为函数的代码片段,然后按 Ctrl+Alt+M 或者从上下文菜单中选择 重构 | 提取方法。

    或者,执行以下操作之一:

    • 按 Ctrl+Alt+Shift+T 并选择 提取方法。

    • 前往 重构 | 提取 | 方法。

  2. 如果所选表达式位于函数/方法内部,请从列表中选择目标作用域:

    • 如果您选择 全局 ,提取的函数将在任何函数外部声明。 请参阅 上面的 Example 1。

    • 要在当前封闭函数内定义提取的函数,请选择 function <current enclosing function name>。 请参见 Example 3上文。

    提取方法 - 选择目标作用域
  3. 指定要提取的函数/方法名称。

    提取方法 - 选择要提取的函数/方法名称

默认打开 Extract Function 对话框

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

提取超类

提取超类重构会基于当前类的成员创建一个新的抽象类。 创建的类会自动扩展。

假设有一个类 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..."); } }

提取超类

  1. 将文本光标放在要从中提取超类的类内任意位置。

  2. 从主菜单中选择 重构 | 提取 | 超类 或从上下文菜单中选择 重构 | 提取超类。 提取超类 对话框将打开。

  3. 指定新超类的名称,并选中要包含在其中的类成员旁边的复选框。 可选地,标记您要设为抽象的成员。

  4. 在 目标文件 字段中,指定新类所在文件的位置。 默认情况下,该字段会显示调用重构时所在当前文件的路径。

  5. 选择 提取超类。 IntelliJ IDEA 创建一个新类,并使用 extends 标记源类。

    要创建超类,并将方法形参中对源类的引用替换为对超类的引用,请选择 提取超类,并在可能的情况下使用它。 IntelliJ IDEA 会在 查找 工具窗口的 重构预览 窗格中显示建议的更改。

引入对象或数组析构

析构可让你轻松地将数组和对象中的值解压缩到变量中。 此功能性具有非常简洁的语法,通常在需要在应用程序中传递数据时使用。 欲了解更多信息,请参阅 Exploring ES6。

在 IntelliJ IDEA 中,可以使用意图操作 Alt+Enter 调用析构。 使用 替换为对象/数组析构 操作时,原始赋值会被移除。 要保留赋值,请使用 引入对象/数组析构。

替换原始分配

  1. 将文本光标放在数组或对象中的值处,然后按 Alt+Enter。

  2. 从列表中选择 替换为对象解构 或 替换为数组解构。

    如果数组或对象中的某些值未使用,这些元素将被跳过:

保持原始分配

  1. 将文本光标放在数组或对象中的值处,然后按 Alt+Enter。

  2. 从列表中选择 介绍对象解构 或 介绍数组解构。

    此意图操作在使用 React 类组件时非常方便:

生成函数的解构参数

  1. 将文本光标放在函数/方法的形参处,然后按 Alt+Enter。

  2. 从列表中选择 将参数转换为对象。

    有意通过解构操作:将参数转换为对象

内联重构

内联重构与 提取重构相反。

示例 1: 内联变量

内联变量重构会将变量或常量的冗余用法替换为其初始值设定项。 此类重构仅适用于块作用域变量和函数/方法作用域变量。

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

示例 2:内联函数

内联方法/内联函数/方法 重构会将方法或函数/方法的主体放入其调用方(s)的主体中;方法/函数/方法本身会被删除。

在下面的示例中, 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; }

进行 Inline 重构

  1. 在编辑器中,把文本光标放在要内联的符号上,然后按 Ctrl+Alt+N 或从上下文菜单或主菜单中选择 重构 | 内联。

更改签名重构

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

您还可以使用 Introduce Parameter重构来添加参数。

以下示例展示了运行 Change Signature 重构的不同方式。 在所有情况下,函数 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:重命名函数,添加默认参数,并将参数传递到函数调用

在此示例中,函数/方法 result() 被重命名为 generate_result()。 添加了默认形参 input ,其值为 100。 新形参在 generate_result() 中初始化,对于 ES6 语言级别采用 function generate_result(input = 100) {} 格式,对于 ES5 采用 input = input || 100。 input 参数通过调用函数 show_result() 传播,因此函数调用相应地更改。

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 中,使用形参表及其右侧的按钮:

    • 要添加新参数,请点击 "添加"按钮 &#xa0; Alt+Insert ,并指定新参数的名称及其默认值,或指定通过函数调用传递的值。

      请参见 示例1和 示例2上方。

    • 要移除参数,请点击相应行中的任意单元格,然后点击 删除按钮 &#xa0; Alt+Delete。

    • 要重新排序参数,请使用 上一个出现按钮 &#xa0; Alt+Up 和 下一个匹配项按钮 &#xa0; Alt+Down。

    • 要重命名形参,请编辑 名称 字段。

    • 如果必要,请 传递新参数 到调用当前函数的函数中。

沿调用层次传播参数

  1. 在 更改签名 对话框 Ctrl+F6 中,选择参数并点击 Propagate Parameter 按钮。 选择传播新参数的方法 对话框打开。 左侧窗格会显示函数/方法调用的层次结构。 选择函数/方法时,右侧窗格会分别在 调用方法 和 被调用方法 字段中显示其代码及其调用的函数/方法的代码。

    请参见 Example 3上方。

  2. 在左侧窗格中,选中要将形参传播到的函数/方法旁边的复选框,然后点击 OK。

预览更改并完成重构

  1. 在 更改签名 对话框中,点击 预览。

  2. 在 重构预览 选项卡(位于 查找工具窗口 )中, 查看预期更改 ,进行必要调整,准备就绪后点击 执行重构。

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

对于类、函数/方法、常量变量、字符串、对象和类型,可以将 export default 语句替换为带名称的 导出 语句,并相应更新对应的 import 语句。

如果符号被重新导出,对应的 导出 语句也会更新。

可以从 export default 语句和 import 语句调用该重构。

  • 将文本光标放在 export default 语句处,或放在要导出的内容的名称处,按 Alt+Enter ,然后选择 将 default export 转换为命名 export。 要切换预览,请按 Ctrl+Q。

    从 export 语句调用默认导出转换
  • 在 import 语句内,将文本光标放在所导入内容的名称处,按 Alt+Enter ,然后选择 将 default export 转换为命名 export。 预览 (Ctrl+Q) 会显示 import 语句将如何更新。

    从 import 语句调用默认导出转换

将命名 export 转换为 default export

对于类、函数、常量、字符串、对象和类型,您可以将命名 导出 语句替换为 export default 语句,并相应更新对应的 import 语句。

可以从 export default 语句和 import 语句调用该重构。

  • 在 导出 语句内,将文本光标放在要导出的内容的名称处,按 Alt+Enter ,然后选择 将命名 export 转换为 default export。 要切换预览,请按 Ctrl+Q。

    从 export 语句中将命名导出转换为默认导出
  • 在 import 语句内,将文本光标放在所导入内容的名称处,按 Alt+Enter ,然后选择 将命名 export 转换为 default export。 预览 (Ctrl+Q) 会显示 import 语句将如何更新。

    从 export 语句中将命名导出转换为默认导出
2026年 11月 3日