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

IntelliJ IDEA 2026.3 Help

重构 TypeScript

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

移动重构

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

移动类、函数或变量

  1. 选择要移动的符号。

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

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

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

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

向上拉取类成员重构

上移类成员重构将类方法在类层次结构中上移——从当前类移动到它实现的超类或接口。

将类的方法移动到超类或接口

  1. 通过执行以下任一操作打开 向上拉取成员 对话框:

    • 将文本光标放在要将成员向上拉取的类中的任意位置,然后从主菜单或上下文菜单中选择 重构 | 上移成员。

    • 按 Ctrl+Shift+A 并搜索 向上拉取成员。

  2. 从 向上拉取成员 对话框的列表中,选择要将方法移动到的超类或接口。

  3. 要向上拉取某个方法,请在 要上移的成员 列表中选中其旁边的复选框。 如果适用,请选择方法旁边的 设为抽象 复选框。

假设您有一个类 AccountingDepartment ,它扩展了一个抽象类 Department 并实现了一个接口 ReportingDepartment。

abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } interface ReportingDepartment { generateReports(): void } class AccountingDepartment extends Department implements ReportingDepartment { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

示例 1:将类方法移动到超类

在这个例子中,该 PrintMeeting() 方法被从 AccountingDepartment 移动到 Department。

abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } interface ReportingDepartment { generateReports(): void } class AccountingDepartment extends Department implements ReportingDepartment { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }
abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } } interface ReportingDepartment { generateReports(): void } class AccountingDepartment extends Department implements ReportingDepartment { constructor() { super("Accounting and Auditing"); } generateReports(): void { console.log("Generating accounting reports..."); } }

示例 2:将类方法移动到接口

在此示例中, PrintMeeting() 方法从 AccountingDepartment 类复制到 ReportingDepartment 接口。

abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } interface ReportingDepartment { generateReports(): void } class AccountingDepartment extends Department implements ReportingDepartment { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }
abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } interface ReportingDepartment { generateReports(): void printMeeting(): void } class AccountingDepartment extends Department implements ReportingDepartment { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

重命名重构

除此之外,在任何语言环境中均可使用的 重命名文件和文件夹功能,您还可以重命名类、方法、变量、参数和字段。 IntelliJ IDEA 会更改符号在其声明中的名称,并默认更改当前项目中的所有用法。

重命名重构是在原地执行的,但您可以按 Shift+F6 来在 重命名 对话框中配置重构范围。

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

  1. 在编辑器中,选择要重命名的类、方法、变量或字段,然后按 Shift+F6 或从上下文菜单中选择 重命名。

  2. 在画布中指定符号的新名称。 输入名称或从列表中选择一个合适的名字。

  3. 可选:

    点击 注释和字符串中的重命名图标 文本匹配项中的重命名图标 旁边的高亮符号以打开 同时在以下位置重命名 弹出窗口,并选中 在注释和字符串中搜索 和 搜索文本出现位置 复选框以重命名该符号在注释、字符串文本和文本中的用法。

  4. 可选:

    要打开 重命名 对话框查看更多选项,请再次按 Shift+F6。

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

    • 选中 搜索文本出现位置 复选框,可以重命名项目中 HTML 和其他文件中的匹配符号。

    • 选中 在 JavaScript 文件中搜索 复选框以重命名生成的 JavaScript 代码中的符号用法。

    • 选中 搜索动态引用 复选框以重命名符号的动态用法。

      请注意,包括动态用法的重构可能会导致如下面示例中所示的错误重命名。 这里 target 在 console.log(e.target) 里可以更改为 myTarget ,因为 e 的类型是 any ,这意味着它也可以是 myInt。

      interface myInt { target: string } function onClick(e: any) { console.log(e.target); }
      interface myInt { myTarget: string } function onClick(e: any) { console.log(e.myTarget); }
  5. 为避免错误重命名,请在应用更改之前 预览这些更改。

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

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

    重构预览:符号的动态用法标记为排除在重构之外

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

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

如果拒绝此建议,之后可以随时使用 重命名文件… 意图操作重命名该文件。 如果刚刚创建了一个新文件,但在其中开始键入类或接口时又想出了更好的名称,此操作会很有用。

另一项意图操作会建议将类移动到具有相应名称的新文件中。 建议文件名的格式由 文件名约定 列表中选择的样式决定,可在 代码样式:JavaScript页面上找到。

将文件名称与对应类的名称保持一致

  1. 将文本光标放置在类名处并按 Alt+Enter。

  2. 从意图列表中选择 将文件重命名为 <class_name.ts> 以匹配类名 或 将类<class_name>移动到文件<class_name.ts>。

    将类移动到文件中并保持名称一致

提取/引入重构

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

引入形参

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

假设您有一段代码,其中在函数 "您好," 中硬编码了 greeter()。

function greeter(firstName : String, lastName : String) { return "Hello, " + firstName + " " + lastName; } document.body.innerHTML = greeter("Jane","User");

通过引入参数重构,您可以将此硬编码的 "您好," 替换为一个 greeting 参数。 新 greeting 参数可以提取为 可选 或 必需。

示例 1:提取一个可选参数

新形参 greeting 被提取为可选形参。 已使用函数默认参数语法将新参数添加到 greeter() 的定义中。 greeter() 的调用未更改。

function greeter(firstName : String, lastName : String, greeting = "Hello, ") { return greeting + firstName + " " + lastName; } document.body.innerHTML = greeter("Jane","User");

示例 2:提取必需的参数

在此示例中,一个新参数 greeting 被提取为必需参数。 因此,相应的函数调用 (document.body.innerHTML = greeter(user); 随之更改。

function greeter(firstName : String, lastName : String, greeting: string) { return greeting + firstName + " " + lastName; } document.body.innerHTML = greeter("Jane", "User", "Hello, ");

引入参数

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

    调用引入形参重构

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

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

    • 前往 重构 | 提取/引入 | 形参。

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

    引入参数:选择一个表达式
  3. 如果找到所选表达式的多个出现位置,请从 找到多个出现位置 列表中选择 仅替换此处 或 替换所有出现位置。 最后,会显示用于配置重构的弹出窗口。

    引入参数弹出窗口
  4. 选择 生成 JSDoc 以生成 JSDoc 注释块。 如果需要指定自定义默认形参值,这可能会有所帮助。

  5. 选择新参数将在何处初始化,并指定其默认值(如果适用):

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

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

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

    了解更多有关可选参数和默认参数的信息,请访问 TypeScript official website。

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

    引入参数:result

选择重构模式

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

  • 预览重构结果。

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

  • 指定默认参数值。

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

引入变量

使用 Introduce Variable重构将表达式替换为 函数作用域变量 (var)、 块作用域变量 (let)或 块作用域常量 (const)。 此重构使源代码更易于阅读和维护。 它还有助于避免使用没有关于其值或用途说明的硬编码常量。

function Multiplication(a : number, b : number) { let d = (a + b) * (a + b); return d; } var e = Multiplication(4, 6);
function Multiplication(a : number, b : number) { let c = a + b; let d = (c) * (c); return d; } var e = Multiplication(4, 6);

引入变量

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

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

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

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

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

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

    引入变量:检测到所选表达式的多次出现

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

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

    引入变量:选择范围
  5. 在列表中双击建议的形参名称之一以接受它,或在带画布的字段中指定自定义名称。 按 Enter 准备。

选择重构模式

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

引入常量

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

假设您有一段包含硬编码 部门名称: 的代码。

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

通过引入常量重构,可以将硬编码的 部门名称 替换为常量。 提取常量的范围取决于新常量声明的上下文(在封闭方法内部、作为类的字段或不在任何类中)。

示例 1:引入常量 departmentName 并在 printName() 方法内声明它

export class MyAccountingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } printMeeting(): void {...} generateReports(): void {...} }
export class MyAccountingDepartment { name: string; printName(): void { const departmentName = "Department name: "; console.log(departmentName + this.name); } printMeeting(): void {...} generateReports(): void {...} }

示例 2:引入常量 departmentName 并将其声明为类 AccountingDepartment 的 _departmentName 字段

export class MyAccountingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } printMeeting(): void {...} generateReports(): void {...} }
export class MyAccountingDepartment { name: string; private readonly _departmentName = "Department name: "; printName(): void { console.log(this._departmentName + this.name); } printMeeting(): void {...} generateReports(): void {...} }

示例 3:引入常量 departmentName 并在任何类外声明它

export class MyAccountingDepartment extends Department implements ReportingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } printMeeting(): void {...} generateReports(): void {...} }
const departmentName = "Department name: "; export class MyAccountingDepartment { name: string; printName(): void { console.log(departmentName + this.name); } printMeeting(): void {...} generateReports(): void {...} }

引入常量

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

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

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

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

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

    引入常量:选择表达式
  3. 选择新常量的作用范围:

    • 局部常量 将在封闭方法内声明,请参阅 示例 1。

    • 类字段 将在当前类中声明,请参阅 示例 2。

    • 全局或模块常量 将在任何类之外声明,请参阅 示例 3。

    IntelliJ IDEA 会显示一个工具提示,指出提取的常量将根据所选作用域在哪里声明。

    引入常量:选择作用域
  4. 如果 IntelliJ IDEA 检测到该表达式的多个出现位置,请选择是替换所有出现位置,还是仅替换调用重构的位置。

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

    引入常量:选择名称

引入字段

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

假设您有以下代码:

class Rectangle { constructor(public height: number, public width: number) { this.height = height; this.width = width; } get area() { return this.calcArea(); } calcArea() { return this.height * this.width; } }

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

示例 1:引入字段 _calcAreais 并在外围方法 get Area () 中对其进行初始化

class Rectangle { constructor(public height: number, public width: number) { this.height = height; this.width = width; } private _calcArea: number; get area() { this._calcArea = this.calcArea(); return this._calcArea; } calcArea() { return this.height * this.width; } }

示例 2:引入字段 _calcAreais 并在其声明中对其进行初始化

class Rectangle { constructor(public height: number, public width: number) { this.height = height; this.width = width; } private _calcArea = this.calcArea(); get area() { return this._calcArea; } calcArea() { return this.height * this.width; } }

示例 3:引入字段 _calcAreais 并在类的构造函数中对其进行初始化

class Rectangle { constructor(public height: number, public width: number) { this._calcArea = this.calcArea(); this.height = height; this.width = width; } private _calcArea: number; get area() { return this._calcArea; } calcArea() { return this.height * this.width; } }

介绍一个字段

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

    引入字段重构 - 调用

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

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

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

  2. 如果 IntelliJ IDEA 检测到该表达式的多个出现位置,请选择是替换所有出现位置,还是仅替换调用重构的位置。

    在 TypeScript 中提取字段:检测到多个表达式
  3. 在弹出窗口中,选择新字段将在哪里初始化:

    • 当前方法 ,请参阅 示例 1。

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

    • 构造函数 ,请参见 示例 3。 请注意,如果您从字段初始化器调用重构,则此选项将被禁用。

    在 TypeScript 中提取字段:选择初始化
  4. 在字段声明或构造函数中初始化时,可以使用 readonly修饰符引入新字段。 要做到这一点,选中 设为只读 复选框。

  5. 请选择字段可见性,可用选项有 公开、 私有 和 protected。 了解字段可见性修饰符详细信息,请参阅 TypeScript 官方网站

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

选择重构模式

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

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

重构 TypeScript:引入字段

提取方法

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

示例 1:从另一个方法内的表达式中提取全局方法

在此示例中,从 let c = a + b; 表达式中提取了一个全局范围的方法 NewMethod()。 提取方法的参数从 let c = a + b; 表达式中获取。

示例 1.1:生成函数/方法声明

function MyFunction(a : number, b : number) { let c = a + b; let d = c * c; return d; }
function NewMethod(a: number, b: number) { let c = a + b; return c; } function MyFunction(a : number, b : number) { let c = NewMethod(a, b); let d = c * c; return d; }

示例 1.2:提取的函数/方法在表达式内声明

function MyFunction(a : number, b : number) { let c = a + b; let d = c * c; return d; }
let NewMethod = function (a: number, b: number) { let c = a + b; return c; }; function MyFunction(a : number, b : number) { let c = NewMethod(a, b); let d = c * c; return d; }

示例 2:在封闭方法内部声明提取方法

在此示例中,方法 NewMethod() 从 let c = a + b; 表达式中提取。 目标范围 function MyFunction 已选择。

function MyFunction(a : number, b : number) { let c = a + b; let d = c * c; return d; }
function MyFunction(a : number, b : number) { let NewMethod = function () { let c = a + b; return c; }; let c = NewMethod(); let d = c * c; return d; }

示例 3:从任何方法之外的表达式中提取方法

从 var e = MyFunction(4, 6); 表达式中提取出一个 NewMethod() 方法,该表达式不在任何方法内。 提取的方法是全局范围的。

var e = MyFunction(4, 6);
let NewMethod = function () { var e = MyFunction(4, 6); }; NewMethod();

提取函数/方法或方法

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

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

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

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

  2. 如果所选表达式位于另一个函数/方法内部,请从列表中选择目标作用域。 IntelliJ IDEA 会显示一个工具提示,指出提取的函数/方法将在哪里声明:

    ws_ts_extract_method_choose_scope.png
    • 如果您选择 顶层 ,提取的函数将声明在任何函数之外,请参阅上面的 示例 1。

    • 要在当前包含函数内声明提取的函数,请选择 function <current enclosing function name> ,请参阅上面的 示例2。

  3. 要打开具有更多选项的 Extract Function提取函数/方法 对话框,请再次按 Ctrl+Alt+M。 在此对话框中,您可以选择提取的函数是通过生成的 function declaration声明,还是 在表达式内部声明,并配置要作为参数传递的变量集。 请参见 上面的示例。

默认打开 Extract Function 对话框

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

提取类型别名

使用此重构将类型声明表达式转换为 type alias ,并将所有出现的表达式替换为此别名。

假设您有以下带有 { z: number } 类型声明的代码片段:

function returnsObj(): { x : number, y : {z : number} } { return null } function anotherObjectReturned(): {x : number, y : {z : number} } { return null }

在下面的示例中,一个类型别名 MyNewAlias 被从 { z: number } 类型声明中提取出来:

type MyNewAlias = { z : number }; function returnsObj(): { x : number, y : MyNewAlias } { return null } function anotherObjectReturned(): { x : number, y : MyNewAlias } { return null }

提取类型别名

  1. 在编辑器中, 将文本光标置于您希望用类型别名替换的表达式内, 然后从上下文菜单中选择 重构 | 提取 Type Alias 或从主菜单中选择 重构 | 提取 | 类型别名。

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

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

    提取类型别名 - 多个出现位置
  4. 在带画布的字段中,输入类型别名的名称,准备好后按 Enter。

    提取类型别名 - 指定新名称

提取超类

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

假设有一个类 AccountingDepartment ,并且预计其中的 printName() 方法将被重用。

class AccountingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

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

class Department { name: string; printName(): void { console.log("Department name: " + this.name); } } class AccountingDepartment extends Department { printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

提取超类

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

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

  3. 指定新超类的名称,并选中要包含在其中的类成员旁边的复选框。

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

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

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

提取接口

该 提取接口 重构基于当前类的成员创建新接口。 创建的接口将自动实现。

假设您有一个类 AccountingDepartment 并且您期望其中的 generateReports() 方法将有其他实现。

abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } class AccountingDepartment extends Department { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

您可以提取一个 DepartmentInterface 接口并将 generateReports() 包含在其中。

abstract class Department { constructor(public name: string) { } printName(): void { console.log("Department name: " + this.name); } } interface DepartmentInterface { generateReports(): void; } class AccountingDepartment extends Department implements DepartmentInterface { constructor() { super("Accounting and Auditing"); } printMeeting(): void { console.log("The Accounting Department meets each Monday at 10 a.m"); } generateReports(): void { console.log("Generating accounting reports..."); } }

提取接口

  1. 将文本光标置于您想要提取接口的类中的任何位置。

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

  3. 指定新接口的名称,并选择您希望包含在其中的类成员旁边的复选框。

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

  5. 选择 提取接口。 IntelliJ IDEA 创建一个新的接口,并将源类标记为其实现。

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

引入对象或数组解构

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

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

替换原始分配

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

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

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

保留原始分配

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

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

生成函数的解构参数

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

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

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

内联重构

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

示例 1: 内联变量

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

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

示例 2:内联方法

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

在下面的示例中, Sum() 的主体被放置在 Multiplication() 的主体内。

function Sum(a: number, b: number) { return a + b; } function Multiplication(a: number, b: number) { let d = Sum(a, b) * Sum(a, b); return d; } var e = Multiplication(4, 6);
function Multiplication(a : number, b : number) { let d = (a + b) * (a + b); return d; } var e = Multiplication(4, 6);

进行 Inline 重构

  1. 在编辑器中,将文本光标置于要内联的符号处,然后执行以下操作之一:

    • 按下 Ctrl+Alt+N。

    • 按 Ctrl+Alt+Shift+T 并从列表中选择 内联。

      调用内联变量重构操作
    • 从上下文菜单或主菜单中选择 重构 | 内联。

更改签名重构

使用 Change Signature重构来更改函数的名称、可见性和返回类型,添加、删除、重新排序和重命名参数,并通过调用层次结构传播新参数。

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

在下面的示例中,函数 eat() 被重命名为 feed() ,并引入了一个新的 boolean 参数 isMammal。

class Animal { constructor(age: number, name: string){ } eat(food: string[]): void { } } let Max = new Animal(23, 'Max'); Max.eat(['Apple', 'Parsley']); let Daisy = new Animal(12, 'Daisy'); Daisy.eat(['Pork', 'Fish']);
class Animal { constructor(age: number, name: string){ } feed(food: string[], isMammal: boolean = true): void { } } let Max = new Animal(23, 'Max'); Max.feed(['Apple', 'Parsley'], false); let Daisy = new Animal(12, 'Daisy'); Daisy.feed(['Pork', 'Fish'], false);

调用更改签名

  • 在编辑器中,将文本光标放在要重构的函数/方法名称内,然后按 Ctrl+F6 ,或从上下文菜单或主菜单中选择 重构 | 更改签名。 更改签名 对话框将打开。

重命名函数

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

更改函数的返回类型

  • 在 返回值类型 字段中,指定函数返回值的类型。 如果该字段为空,则返回类型将被视为 void。 了解更多有关返回类型的信息,请访问 TypeScript 官方网站。

更改函数的可见性

管理函数参数

  • 在 更改签名 对话框 Ctrl+F6 中,使用形参表及其右侧的按钮:

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

      如果有必要,把 新参数传递给调用当前函数的函数。

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

    • 要重新排序参数,使必需参数列在可选参数之前,请使用 “向上”按钮 &#xa0; Alt+Up 和 “向下”按钮 &#xa0; Alt+Down。 更多信息,请访问 TypeScript official website。

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

沿调用层次传播参数

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

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

预览更改并完成重构

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

  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日