重构 TypeScript
源代码重构可以在不修改运行时行为的情况下，通过重构代码来提高项目的质量和可维护性。Visual Studio Code 支持重构操作（refactorings），例如提取方法和提取变量，以便在编辑器内改善你的代码库。
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 代码（例如始终为真的 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 可以自动更新引用该移动文件的所有导入路径。
js/ts.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
将 "js/ts.suggestionActions.enabled" 设置为 false 以禁用建议。
下一步计划
继续阅读以了解有关以下内容的更多信息
- 编辑 TypeScript - 了解针对 TypeScript 的 VS Code 编辑功能。
- 调试 TypeScript - 为你的 TypeScript 项目配置调试器。