使用 32 个 JavaScript 重构增强 VS Code

💡 这篇博文是关于 P42 JavaScript Assistant v1.24 的

Visual Studio Code 是一款出色的 JavaScript 和 TypeScript 编辑器，它已经包含许多重构功能，例如重命名和提取功能。

P42 JavaScript 助手新增 32 项重构和代码操作，为 VS Code 带来更强大的功能。P42 重构主要涵盖以下三个方面：

• A.代码重构：改变语句和表达式的重构。
• B.条件：改变或简化条件和条件相关结构的重构。
• C.代码现代化：将现有代码升级到较新 ECMAScript 版本中引入的语言特性的重构。

P42 重构可作为快速修复（Mac：CMD + .，Windows：）CTRL + .和重构上下文菜单（CTRL + SHIFT + R）提供。

P42 尚处于开发初期，尚未涵盖类级或多文件重构。如果您想提供反馈，例如，您希望在 P42 中看到哪些重构或功能，或者希望收到更新，
您可以在 Twitter 上关注我们：@p42ai或关注我们的 LinkedIn。

以下是每个重构操作的直观示例：

A. 代码重组

1. 内联 const

将 const 声明的值内联到其引用中并删除该声明。

2. 提取 Const

将表达式的（多个）出现提取到封闭块范围内的 const 中。

3. 将子字符串提取到 Const

将字符串文字的选定部分提取到 const 中。

4. 内联返回语句

将 if-else 或 switch 语句中分配的返回变量内联到返回语句中。

5. 将运算符推送到赋值语句中

如果可能的话，将运算符从二元表达式移到赋值表达式中。

6. 将运算符从赋值语句中拉出

将运算符从运算符赋值表达式（例如+=）移到正则二进制表达式中。

7. 将 for 循环转换为 for..of 循环

将常规for循环转换为for...of循环并删除索引变量。

8. 将 for 循环转换为 forEach 循环

将常规for循环转换为.forEach()循环并删除索引变量。

9. 将 If-Else 转换为 Guard 子句

将从函数返回的 if 语句更改为保护子句。

10. 使用 Try...Catch 包围语句

将一个或多个语句包装在一个try..catch块中。

11.拆分变量声明

将组合变量声明拆分为单独的变量声明。

12. 折叠成简写符号

将对象属性折叠成简写符号。

13. 扩展简写属性

将简写符号扩展为完整符号。

B. 条件语句

14. 反转条件

反转 if-else 语句和条件表达式的条件（并翻转内容）。

15. 翻转运算符

交换交换二元运算符的参数顺序（并在需要时更新运算符，例如翻转<到时>=）。

16. 下推非运算符

将( !not 运算符) 推入&&, ||, !=, !==, ==, ===, <, <=,二进制表达式中。>>=

17. 合并嵌套的 If

将一个语句if内部的另一个语句合并if为一个if带有条件的语句&&。

18. 合并嵌套的 Else-If

if将else 语句内的 - 语句合并为else if。

19. 转换为 '== null' 检查

null将与和的严格相等性检查转换undefined为等效== null检查。

20. 将返回语句与条件语句结合起来

将if-else语句转换为return条件语句。

C. 代码现代化

21. 添加数字分隔符

为十进制、十六进制、二进制、八进制和大整数文字添加“_”分隔符（ES2021）。

22. 使用空值合并分配默认值

使用空值合并运算符 (ES2020) 缩短默认值分配。

23. 转换为可选链式表达式

将一连串 nullish 或 falsy 检查转换为可选的链式表达式 (ES2020)。VS Code 已在某些情况下支持此重构（例如x && x.a）。P42 增加了对其他链式构造的支持。

24. 将 Math.pow 转换为指数运算符

转换Math.pow(...)表达式以使用**指数运算符（ES2016）。

25. 将 Var 转换为 Let 和 Const

var将声明转换为let和const（基于其用法）（ES2015）。

26. 将函数转换为箭头函数

将函数表达式转换为箭头函数 (ES2015)。VS Code 本身也支持此重构。

27. 转换为对象方法

将带有函数的属性赋值转换为方法声明（ES2015）。

28. 使用默认参数

将默认值赋值转换为参数默认值（ES2015）。

29. 使用模板字符串

将字符串连接转换为模板字面量 (ES2015)。VS
Code 本身也支持此重构。P42 版本增加了对一些额外情况的支持，例如纯字符串连接。

30. 使用 String.startsWith

将第一个字符串字符的检查转换为String.startsWith()（ES2015）。

31. 使用 String.endsWith

将最后一个字符串字符的检查转换为String.endsWith()（ES2015）。

32. 将 .apply() 转换为展开运算符

转换.apply()调用以使用扩展运算符 ( ...) (ES2015)。

您可以在Visual Studio Code Marketplace中找到P42 JavaScript 助手。

重构快乐！