VSCode提取函数需先手动选中有效代码，光标不能在注释或字符串内；参数名可F2重命名；函数默认插顶部，可剪切粘贴就近放置；React中需手动转为自定义Hook。
提取函数时没反应？先确认光标位置和选中范围
VSCode 的 Extract Function 重构功能依赖两个硬性条件：必须有有效选中（非空、非跨语法单元乱选），且光标不能落在注释或字符串字面量内部。常见错误是只把光标停在代码行上按快捷键，结果什么都没发生——它不会自动推断“你想提取这一整行”，必须手动拖选。
实操建议：
- 用鼠标或
Shift + 方向键精确选中要封装的表达式或语句块（支持多行，但不能跨函数边界） - 避免选中末尾分号（JS/TS 中会报
Cannot extract to function: selected code is not a valid statement or expression） - 如果选中后右键无
Extract Function选项，检查当前语言模式是否正确（左下角显示JavaScript而不是Plain Text）
提取后参数名全是 arg0、arg1？别手动改，用重命名触发器
VSCode 默认根据变量引用自动推导参数名，但若原始代码里用的是临时变量（比如 let tmp = x * 2），它就只能退化为 arg0。这不是 bug，是它不敢瞎猜语义。
实操建议：
- 提取完成后，立刻按
F2（重命名），光标会自动停在第一个参数上，直接输入新名，回车后所有调用处同步更新 - 如果想提前控制命名，可在选中前先把关键变量重命名为有意义的名字（如把
tmp改成scaledValue），再提取 - 注意：TypeScript 中若原变量有类型注解（
const count: number = items.length），提取后参数会带: number，JS 则不会
为什么提取出的函数总被插到文件顶部？想就近插入怎么办
VSCode 默认把新函数放在当前文件最上方（或模块顶层作用域起始处），这是为了保证声明提升安全（尤其对 var 或函数声明），但实际开发中更想要“就近定义”——比如放在调用它的函数下方，避免跳转阅读断层。
实操建议：
- 提取后立即用
Ctrl + X剪切新函数，然后回到原调用位置上方粘贴（VSCode 会自动调整缩进） - 或者启用实验性设置：
"javascript.suggest.autoImports": false并配合 ESLint 的no-unused-vars规则，能减少因位置导致的未使用警告 - 注意：如果目标函数是
async或用了await，而原上下文是同步函数，VSCode 会强制生成async版本并加await调用，此时位置错乱容易引发执行顺序误解
React 函数组件里提取逻辑，为什么自动变成普通函数而不是自定义 Hook
VSCode 的内置提取不识别 React 规范，它只看语法结构。即使你选中的是 useState 和 useEffect 组合，它也只会生成一个普通函数，不会加 use 前缀，更不会校验 Hook 规则（比如不能写在条件里）。
实操建议：
- 别依赖自动提取做 Hook 封装；先手动创建
useXXX函数骨架，再把逻辑粘过去 - 如果真要快速生成，可先提取为普通函数，再手动改名、加
use前缀，并检查是否满足 Hook 规则（比如移出条件分支、确保只在顶层调用） - 第三方插件如
ES7+ React/Redux/GraphQL/React-Native snippets提供usf片段，比重构更贴近 React 场景
真正卡住人的往往不是“怎么点菜单”，而是选中边界模糊、参数推导失准、以及 React 场景下对 Hook 意图的完全无视——这些地方 VSCode 不会提示，但会影响后续维护成本。
