重构 TypeScript _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...");
    }
}

在此示例中，该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...");
    }
}

在此示例中，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...");
    }
}

重命名重构

在编辑器中，选择要重命名的类、方法、变量或字段，然后按或选择Refactor | 从上下文菜单或主菜单重命名。ShiftF6
在画布字段中，指定符号的新名称。输入名称或从列表中选择合适的名称。
可选：
单击突出显示的符号旁边的，打开“同时在弹出窗口中重命名”，然后选择“在注释和字符串中搜索”和“搜索文本出现”复选框，以重命名注释、字符串文字和文本中符号的用法。
提示
重命名参数时，弹出窗口中的“同时重命名” 不可用。要指定其他选项，请再次打开“重命名”对话框。ShiftF6
可选：
要打开包含更多选项的重命名对话框，请再按一次。ShiftF6
- 选中“在注释和字符串中搜索”复选框可重命名注释、文档注释和字符串文字中符号的用法。
- 选中“搜索文本出现”复选框可重命名 HTML 和项目中包含的其他文件中的文本中的匹配符号。
- 选中“在 JavaScript 文件中搜索”复选框以重命名生成的 JavaScript 代码中符号的用法。
- 选择搜索动态引用复选框以重命名符号的动态用法。
  提示
  如果您选中“搜索动态引用”复选框，则默认情况下将打开该对话框，直到您清除它为止。
  请注意，在重构中包含动态用法可能会导致错误的重命名，如下例所示。这里的targetinconsole.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); }
为了避免错误重命名，请在应用更改之前预览更改。
默认情况下，在“重构预览”工具窗口中，符号的所有动态用法都标记为已排除，并分组在“代码中对 <symbol> 的动态引用”节点下。要将重构应用于用法，请从其上下文菜单中选择“包含” 。

提取/引入重构

参数介绍

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

function greeter(firstName : String, lastName : String) {
    return "Hello, " + firstName + " " + lastName;
}

document.body.innerHTML = greeter("Jane","User");

通过引入参数重构，您可以用参数替换此硬编码。新参数可以作为或根据提取。

提取新参数greeting作为可选参数。greeter()新参数被添加到使用函数默认参数语法的定义中。的调用greeter()没有改变。

function greeter(firstName : String, lastName : String, greeting = "Hello, ") {
    return greeting + firstName + " " + lastName;
}

document.body.innerHTML = greeter("Jane","User");

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

专业的重构 TypeScript﻿

移动重构﻿

移动类、函数或变量﻿

拉动类成员重构﻿

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

重命名重构﻿

提示

提示

提示

保持类名称和包含文件的名称一致﻿

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

提取/引入重构﻿

参数介绍﻿

引入一个参数﻿

专业的
重构 TypeScript

移动重构

移动类、函数或变量

拉动类成员重构

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

重命名重构

保持类名称和包含文件的名称一致

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

提取/引入重构

参数介绍

引入一个参数