重构 TypeScript
源代码重构可以通过重构代码而不修改运行时行为来提高项目的质量和可维护性。Visual Studio Code 支持重构操作（重构），例如提取方法和提取变量，以便从编辑器中改进您的代码库。
Visual Studio Code 通过TypeScript语言服务内置支持 TypeScript 重构，在本主题中，我们将演示使用 TypeScript 语言服务的重构支持。
重命名
最简单的重构之一是重命名方法或变量。按下 F2 可在您的 TypeScript 项目中重命名光标下的符号
重构
要查看可用的 TypeScript 重构，请将光标放在源代码的某个区域，然后右键单击以显示编辑器上下文菜单并选择 重构，或直接按下 ⌃⇧R (Windows, Linux Ctrl+Shift+R)。
有关重构的更多信息以及如何为单个重构配置键盘快捷键，请参阅重构。
可用的 TypeScript 重构包括
-
提取到方法或函数 - 将选定的语句或表达式提取到文件中的新方法或新函数。
选择提取到方法或提取到函数重构后，输入提取的方法/函数的名称。
-
提取到常量 - 将选定的表达式提取到文件中的新常量。
-
将类型提取到接口或类型别名 - 将选定的复杂类型提取到接口或类型别名。
-
移动到新文件 - 将文件中顶层范围的一个或多个类、函数、常量或接口移动到新文件。新文件的名称是从选定符号的名称推断出来的。
-
在命名导入和命名空间导入之间转换 - 在命名导入（
import { Name } from './foo'）和命名空间导入（import * as foo from './foo'）之间转换。
-
在默认导出和命名导出之间转换 - 从使用
export default转换为具有命名导出（export const Foo = ...）。 -
将参数转换为解构对象 - 将接受长参数列表的函数重写为接受单个参数对象。
-
生成 get 和 set 访问器 - 通过为其生成 getter 和 setter 来封装选定的类属性。
-
推断函数返回类型 - 向函数添加显式返回类型注释。
-
从箭头函数添加/删除大括号 - 将单行箭头函数转换为多行函数，反之亦然。
快速修复
快速修复是建议的编辑，可以解决简单的编码错误。快速修复的示例包括
- 向成员访问添加缺少的
this。 - 修复拼写错误的属性名称。
- 删除无法访问的代码或未使用的导入
- 声明
当您将光标移动到 TypeScript 错误时，VS Code 会显示一个灯泡，指示可以使用快速修复。单击灯泡或按下 ⌘. (Windows, Linux Ctrl+.) 以显示可用快速修复和重构的列表。
此外，默认启用 代码操作小组件：包括附近的快速修复 (editor.codeActionWidget.includeNearbyQuickFixes) 设置，它将激活来自 ⌘. (Windows, Linux Ctrl+.) (命令 ID editor.action.quickFix) 的行中最接近的快速修复，无论光标在该行中的哪个位置。
该命令将突出显示将使用快速修复进行重构或修复的源代码。普通代码操作和非修复重构仍然可以在光标位置激活。
未使用的变量和无法访问的代码
未使用的 TypeScript 代码（例如始终为 true 的 if 语句的 else 块或未引用的导入）在编辑器中会变灰
您可以通过将光标放在其上并触发快速修复命令（⌘. (Windows, Linux Ctrl+.)）或单击灯泡来快速删除此未使用的代码。
要禁用未使用的代码变灰，请将 "editor.showUnused" 设置为 false。您也可以通过设置仅禁用 TypeScript 中未使用的代码变灰
"[typescript]": {
"editor.showUnused": false
},
"[typescriptreact]": {
"editor.showUnused": false
},
组织导入
组织导入源代码操作会对 TypeScript 文件中的导入进行排序并删除未使用的导入
您可以从 源代码操作 上下文菜单或使用 ⇧⌥O (Windows, Linux Shift+Alt+O) 键盘快捷方式运行 组织导入。
您还可以通过设置在保存 TypeScript 文件时自动执行组织导入
"editor.codeActionsOnSave": {
"source.organizeImports": "explicit"
}
在文件移动时更新导入
当您移动或重命名 TypeScript 项目中其他文件导入的文件时，VS Code 可以自动更新所有引用移动文件的导入路径。
typescript.updateImportsOnFileMove.enabled 设置控制此行为。有效设置值包括
"prompt"- 默认值。询问是否应为每个文件移动更新路径。"always"- 始终自动更新路径。"never"- 不会自动更新路径，也不提示。
保存时代码操作
editor.codeActionsOnSave 设置允许您配置在保存文件时运行的一组代码操作。例如，您可以通过设置启用保存时组织导入
// On explicit save, run fixAll source action. On auto save (window or focus change), run organizeImports source action.
"editor.codeActionsOnSave": {
"source.fixAll": "explicit",
"source.organizeImports": "always",
}
截至今天，支持以下枚举
explicit（默认）：在显式保存时触发代码操作。与true相同。always：在显式保存时以及在窗口或焦点更改时的自动保存时触发代码操作。never：从不触发保存时的代码操作。与false相同。
您还可以将 editor.codeActionsOnSave 设置为要按顺序执行的代码操作数组。
以下是一些源代码操作
"organizeImports"- 在保存时启用组织导入。"fixAll"- “保存时自动修复”计算一轮中所有可能的修复（适用于包括 ESLint 在内的所有提供程序）。"fixAll.eslint"- 仅针对 ESLint 的自动修复。"addMissingImports"- 在保存时添加所有缺少的导入。
有关详细信息，请参阅TypeScript。
代码建议
VS Code 会自动建议一些常见的代码简化操作，例如将 Promise 上的一连串 .then 调用转换为使用 async 和 await。
将 "typescript.suggestionActions.enabled" 设置为 false 可以禁用这些建议。
后续步骤
继续阅读以了解更多关于以下内容的信息：
- 编辑 TypeScript - 了解 VS Code 中用于 TypeScript 的编辑功能。
- 调试 TypeScript - 为您的 TypeScript 项目配置调试器。