PyCharm 2025.3 Help

重构 TypeScript

重构 是在不改变应用行为的情况下更新源代码。 重构有助于让您的代码保持健壮、 DRY ,且易于维护。

移动重构

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

移动类、函数或变量

  1. 选择要移动的符号。

  2. 按下 F6 ,或从主菜单或所选内容的上下文菜单中选择 重构 | 移动。 或者,选择 重构 | 就地重构 或按 Ctrl+Alt+Shift+T ,然后在列表中选择 移动

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

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

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

上移类成员重构

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

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

将类的方法移至超类或接口

  1. 将插入符号置于您要上移成员的类中的任意位置。

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

  3. 在列表中选择要将方法移动到的超类或接口。

  4. 要上移某个方法,请在 要上拉的成员 列表中选中其旁边的复选框。 如适用,请选中该方法旁边的 设为抽象 复选框以进行移动。

重命名重构

除了 重命名文件和文件夹 (适用于任何语言),您还可以重命名类、方法、变量、参数和字段。 PyCharm 会在声明处更改符号名称,并默认更新当前项目中的所有用法。

重命名重构

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

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

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

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

  3. 可选:

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

  4. 可选:

    若要打开具有更多选项的 重命名 对话框,请再次按 Shift+F6

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

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

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

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

      请注意,将动态用法包含在重构中可能会导致错误的重命名,如下例所示。 此处, targetconsole.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> 的动态引用 节点下。 要将重构应用于某个用法,请在其上下文菜单中选择 包含

    重构预览:符号的动态用法被标记为从重构中排除

保持类与其所在文件的名称一致

当您重命名类时,PyCharm 还会在文件与其同名时建议重命名该文件。 如果您接受该建议,PyCharm 会在其他文件的 import 语句中更新此文件的名称。

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

另一个意图操作会建议将该类移动到具有相应名称的新文件中。 建议的文件名格式由 Code Style: JavaScript 页面上的 文件名约定 列表中所选样式决定。

使文件名与对应类名一致

  1. 将插入符号置于类名处,然后按 Alt+Enter

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

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

提取/引入重构

PyCharm 提供多种 提取 重构,用于引入参数、变量、常量、字段、方法和函数。 要运行这些重构中的任意一个,请选择要重构的表达式,然后选择 重构 | <target>。 您可以选择整个表达式,或将插入符号置于表达式内部的任意位置,PyCharm 将帮助您完成选择。

引入参数

使用 引入参数 重构,将函数调用中的某个表达式替换为参数。 PyCharm 将相应更新该函数的声明及其调用。 新参数的默认值可以在函数体内进行初始化,或通过函数调用传递。

假设在函数 greeter() 中有一段包含硬编码 "Hello, " 的代码。

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

通过引入参数重构,您可以将此硬编码的 "Hello, " 替换为 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. 选择新参数的初始化位置,并在适用时指定其默认值:

    • 如果选中 可选参数 复选框,则将在函数体内使用默认值初始化该参数。

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

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

    了解有关可选参数和默认参数的更多信息,请参阅 TypeScript 官方网站

  6. 接受其中一个建议的参数名称,方法是在列表中双击它,或者在带有红色画布的字段中指定自定义名称。 准备就绪后,按 Enter

    引入参数:结果

选择重构模式

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

  • 预览重构结果

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

  • 指定默认参数值

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

引入变量

使用 引入变量 重构,将表达式替换为 函数作用域变量(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

选择重构模式

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

引入常量

使用 引入常量 重构,将表达式替换为 常量。 该重构使您的源代码更易于阅读和维护。 它还帮助您避免使用硬编码的常量,而不解释它们的值或用途。

在不同作用域中引入常量

假设您有一段包含硬编码 Department name: 的代码。

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

通过引入常量重构,您可以将此硬编码的 Department name 替换为常量。 引入的常量的作用域取决于新常量的声明上下文(在封闭方法内、作为类的字段,或在任何类之外)。

示例 1:引入的常量 departmentName 在封闭方法 printName() 内声明

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

示例 2:引入的常量被声明为封闭类 AccountingDepartment 的 _departmentName 字段

class AccountingDepartment extends Department implements ReportingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } }
class AccountingDepartment extends Department implements ReportingDepartment { name: string; private readonly _departmentName = "Department name: "; printName(): void { console.log(this._departmentName + this.name); } }

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

class AccountingDepartment extends Department implements ReportingDepartment { name: string; printName(): void { console.log("Department name: " + this.name); } }
abstract class Department {...} const deparmentName = "Department name: "; class AccountingDepartment extends Department implements ReportingDepartment {...}

引入常量

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

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

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

    • 转到 重构 | 提取 | 常量

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

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

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

    • 类字段 将在当前类内声明,参见 示例 2

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

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

    引入常量:检测到全局常量的多个出现
  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:引入的字段 _calcArea 在封闭方法 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:引入的字段 _calcArea 在其声明中初始化

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:引入的字段 _calcArea 在类的构造函数中初始化

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. 如果 PyCharm 检测到表达式的多个出现,请选择是否要替换所有出现,还是仅替换调用重构的位置。

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

    • 当前方法 ,参见 示例 1

    • 字段声明 ,参见 示例 2

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

    在 TypeScript 中提取字段:选择初始化方式
  4. 当在字段声明或构造函数中进行初始化时,新字段可以使用 readonly 修饰符 引入。 为此,请选中 设为只读 复选框。

  5. 选择字段可见性,可用选项为 公共私有受保护。 了解有关字段可见性修饰符的更多信息,请参阅 TypeScript 官方网站

  6. 接受其中一个建议的参数名称,方法是在列表中双击它,或者在带有红色画布的字段中指定自定义名称。 准备就绪后,按 Enter

选择重构模式

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

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

重构 TypeScript:引入字段

提取方法

提取方法 重构可让您使用提取的代码创建具名方法或函数。 当调用 提取方法 重构时,PyCharm 会检测所选代码片段的输入变量和输出变量。 检测到的输出变量将用作提取的方法或函数的返回值。

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

在此示例中,全局方法 NewMethod() 是从 let c = a + b; 表达式中提取出来的。 提取的方法的参数从 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:从任何方法之外的表达式中提取方法

方法 NewMethod() 是从任何方法之外的 var e = MyFunction(4, 6); 表达式中提取出来的。 提取的方法是全局作用域的。

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

提取函数

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

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

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

    • 转到 重构 | 提取 | 方法

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

    ws_ts_extract_method_choose_scope.png
    • 如果选择 全局 ,提取的函数将在任何函数之外声明,参见 示例 1

    • 要在当前封闭函数内声明提取的函数,请选择 function <current enclosing function name> ,参见 示例 2

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

    ws_ts_extract_method_dialog.png

默认打开提取函数对话框

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

提取类型别名

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

ws_ts_type_alias_to_interface.png

假设您有以下代码片段,其中包含一个 { z: number } 类型声明:

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

在下面的示例中,从 { z: number } 类型声明中提取了类型别名 MyNewAlias

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

提取类型别名

  1. 在编辑器中,将插入符号置于您想用类型别名替换的表达式内,并从上下文菜单中选择 重构 | 提类型别名 ,或从主菜单中选择 重构 | 提取 | 类型别名

  2. 如果在当前插入符号位置检测到多个表达式,请从 表达式 列表中选择所需的表达式。

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

    ws_ts_extract_type_alias_multiple_occurrences.png
  4. 在字段中键入类型别名的名称,准备就绪后,按 Enter

    ws_ts_extract_type_alias_specify_name.png

提取超类

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

假设您有一个类 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 以及 Name 字段包含在其中。

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. 选择 提取超类。 PyCharm 创建一个新类,并用 extends 标记源类。

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

提取接口

提取接口 重构会基于当前类的成员创建一个新的接口。 创建的接口会自动被实现。

假设您有一个类 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. 选择 提取接口。 PyCharm 创建一个新接口,并将源类标记为其实现。

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

引入对象或数组解构

解构可让您轻松将数组和对象中的值解包到变量中。 该功能具有非常简洁的语法,通常在需要在应用中传递数据时使用。 有关更多信息,请参阅 TypeScript 官方网站

在 PyCharm 中,您可以使用意图操作 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:内联方法

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

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

运行内联重构

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

  2. 在与所选符号对应的 内联 对话框中,确认内联重构。

    ws_ts_extract_variable.png

更改签名重构

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

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

在下面的示例中,函数 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 官方网站

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

沿调用层次结构传播参数

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

  2. 在左侧窗格中,选中您要传播参数的函数旁边的复选框,然后点击 确定

预览更改并完成重构

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

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

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

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

如果某个符号被再导出,相应的 export 语句也会更新。

该重构可从 export defaultimport 语句中调用。

  • 将插入符号置于 export default 语句处或您正在导出的名称处,按 Alt+Enter ,并选择 将默认导出转换为命名导出。 要切换预览,请按 Ctrl+Q

    从 export 语句调用默认导出转换
  • import 语句中,将插入符号置于导入内容的名称处,按 Alt+Enter ,并选择 将默认导出转换为命名导出。 预览(Ctrl+Q )显示将如何更新 import 语句。

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

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

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

该重构可从 export defaultimport 语句中调用。

  • export 语句中,将插入符号置于您正在导出的名称处,按 Alt+Enter ,并选择 将命名导出转换为默认导出。 要切换预览,请按 Ctrl+Q

    在 export 语句中将命名导出转换为默认导出
  • import 语句中,将插入符号置于导入内容的名称处,按 Alt+Enter ,并选择 将命名导出转换为默认导出。 预览(Ctrl+Q )显示将如何更新 import 语句。

    在 export 语句中将命名导出转换为默认导出
最后修改日期: 2025年 12月 2日